在水平线html中列出内容块[关闭]

【问题标题】：Listing Blocks of content in horizontal line html [closed]在水平线html中列出内容块[关闭]
【发布时间】：2017-06-08 22:32:42
【问题描述】：

我正在尝试在水平列表中显示信息块，它们目前是垂直的。有什么建议吗？[block example][code]

【问题讨论】：

请出示您的代码
display:inline-block;
代码在哪里？

标签： html css

【解决方案1】：

ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
ul li {
  display: inline-block;
  padding: 10px;
  margin: 10px;
  background-color: #F8F8F8;
}

<ul>
  <li>Block 1</li>
  <li>Block 2</li>
  <li>Block 3</li>
</ul>

【讨论】：

【解决方案2】：

我认为您所要求的一种方法是使用 CSS“显示”属性。您只需将所有要水平内联的块的容器设置为“显示：内联块”，然后将它们浮动。

例如： HTML：

<div id="container">
     <div class="block">
        <p>...</p>
        <p>...</p>
    </div>
    <div class="block">
        <p>...</p>
        <p>...</p>
    </div>
</div>

CSS：

#container {
    display: inline-block;
}

.block {
    float: left;
}

【讨论】：