为什么 div 不在 html 部分中出现 inline-block ？答案

【问题标题】：Why dont the divs appear inline-block in a html section?为什么 div 不在 html 部分中出现 inline-block ？
【发布时间】：2017-07-07 18:50:15
【问题描述】：

所以我使用的是 Html5 模板。这是一个单页纸，我想要一个带有“营业时间”的部分，每行有大约三天 - 以及相应的时间。所以我想要一条带有 de divs mon-tue-wed 的线，另一条线是 thu-fri-sat 和周日以下。

我有这样的 div：

<div>
<strong> Monday </strong><br>
09.15 - 10.00 .. <br>
11.15 - 12:00 ..<br>    
17:30 - 18:15 .. <br>
19:15- 20:00 ..
</div>
<br>

等等

所有 div 都是 :

的子级

<section id="schedule" class="times">

但每当我在 CSS 中引用它时使用：

        section.times> div {
            background-color: #e8edec;
            display: inline-block;

        }

为什么它仍然显示彼此下方的所有内容？

【问题讨论】：

因为你在每个div下面都有一个<br>标签
@Cfreak 确实成功了！不知道那是罪魁祸首。现在每个 div 都已正确排列，但是，由于内容大小不同，标题（日期名称）并没有在一条直线上对齐。你知道怎么解决吗？
我猜这种数据最好显示在表格里面...

标签： css html

【解决方案1】：

希望有帮助，删除<bar>.. 为你制作了css代码。 html:

<div class="c1">
<strong> Monday </strong><br>
09.15 - 10.00 .. <br>
11.15 - 12:00 ..<br>    
17:30 - 18:15 .. <br>
19:15- 20:00 ..
</div>


<div class="c2">
<strong> Monday </strong><br>
09.15 - 10.00 .. <br>
11.15 - 12:00 ..<br>    
17:30 - 18:15 .. <br>
19:15- 20:00 ..
</div>
<br>
</section>

CSS代码：

.times> .c1 {
float: left;
width: 33.33333%;}
.times> .c2{
float: left;
width: 33.33333%;}

【讨论】：

它将在同一行显示彼此靠近的日期和开放时间。