Question

嘿伙计们我是新手，我基本上有以下html ::

<div class="col-md-6 clients">

    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>
    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>
    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>


    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>
    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>
    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>

</div>

现在在第3个col-xs-4之后我想要一些垂直空间，所以我做了以下事情：

<div class="col-md-6 clients">

    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>
    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>
    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>

    <div class="image-separator"></div>

    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>
    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>
    <div class="col-xs-4"><img src="img/1.jpg" alt="" class="img-responsive"></div>

</div>

注意div <div class="image-separator"></div>，我给了它以下的CSS：

.image-separator {
    height: 20px;
}

令人惊讶的是没有创建垂直空间，所以我玩了一下并添加了以下样式：

.image-separator {
    height: 20px;
    width: 100%;
    float: left;
}

这确实有效，现在为什么jsut height:20px不起作用？我真的好奇，所以我教我会来这里问问，有人可以解释一下，我很想学习CSS是如何工作的，所以我想问，CSS新手。 fiddle here

注意:: 我不打算解决这个问题，它已经解决了，我试图理解为什么会这样！

谢谢。

Answer 1

之前它没有用，因为bootstrap列有一个浮动值：float:left，你必须清除浮动：

clear: both

添加到您的间隔号的CSS中

.image-separator {
    height: 20px;
    clear: both;
}

我正在编辑这个答案，因为我忘了说bootstrap有一个类可以更有效地清除浮动元素：clearfix。

Answer 2

它实际上没有用，因为你忘了在div class =“col-xs-4”之前添加div class = row。见下文

    Dim dir = New System.IO.DirectoryInfo("c:\foo\bar")
    Dim file = dir.EnumerateFiles("GLNo1_*.csv").
        OrderByDescending(Function(f) f.LastWriteTime).
        FirstOrDefault()
    If file IsNot Nothing Then
        Dim path = file.FullName
        '' etc..
    End If

高度不增加空div的高度

2 个答案: