html - CSS-制作列表

Question

我怎样才能做这样的事情:

我尝试这样的事情:

    <div class="servers">
      <ul>
          <li><span class="icon"></li>   
          <li><span class="text">Public server#1</span></li>
          <li>IP: 88.88.88.87:270115</li>
          <li><MAPA: de_dust2/li>
      </ul>  
    </div>

也可以试试:

<li><span class="icon"></span><span class="text"> Public server#1</span></li><li><span class="text">IP:81.0.217.184:27020</span></li><li><span class="text">Mapa: de_dust2</span></li<span class="text">Hráči: 50/60</span></li>

使用 CSS:

.text {
    display:inline-block;
    overflow:hidden;
    width: 170px;
    height: 22px;
    line-height: 22px;
}

我知道这是个愚蠢的问题，但我迷路了，我需要在 tihng 之间留出相同的空间，只是不知道如何简单地做到这一点 :)

如果有人可以帮助我，我将非常感激

Answer 1

这是表格实际适用的时间之一。

尝试这样设计:

<table>
    <tr>
      <td class="icon"></td>
      <td>Public server#1</td>
      <td>IP: 88.88.88.87:270115</td>
      <td>MAPA: de_dust2</td>
    </tr>
    <tr>
      <td class="icon"></td>
      <td>Public server#1</td>
      <td>IP: 88.88.88.87:270115</td>
      <td>MAPA: de_dust2</td>
    </tr>
    ...
</table>