如何使敏感div高度？

问题描述：

你知道如何让一个div的高度是反应？在第一张照片是全屏模式，这是相当完美的。但是当我调整屏幕大小（在第二张图片中）时，由于div数字“2”的高度，div数“1”和div数“3”之间有很大的空间。为了您的信息，我正在使用引导程序。
这里是我的div代码：
DIV 1 = <div class="col-md-9 col-sm-9 col-xs-9" style="background-color:white;">
DIV 2 = <div class="col-md-3 col-sm-3 col-xs-3" align="middle" style="background-color:white;">
DIV 3 = <div class="row" style="background-color:white; bottom:0;" width="100%">
股利1和2区是一个DIV <div class="row" style="background-color:white;">
和所有的DIV在DIV <div class="container-fluid"

我想调整屏幕的大小时仍然像全屏模式一样放置，没有空间。 enter image description here 如何使敏感div高度？

enter image description here

如何为你的图像添加一个类'class =“img-responsive”'？ – 2015-03-31 08:18:58

可能的重复[使列在引导相同的高度]（http://*.com/questions/18227326/make-columns-the-same-height-in-bootstrap） – pbenard 2015-03-31 08:24:47

答

的问题是，你的DIV号2是同一行中为您的DIV编号1的他们都需要尽可能最高的人一样高所以行。

为了解决这个问题，你可以做一个行中的格数1列，并把DIV 1和DIV他们的列3

所以它看起来像这样

<row> 
<col 1> 
<row> 
<col> 
div 1 here 
</col> 
</row> 
<row> 
<col> 
div 3 here 
</col> 
</row> 
</col1> 
<col 2> 
div 2 here 
</col 2> 
</row>

这意味着然而，你的旗帜thingy只会传播一半的屏幕。

是否有另一种方式来我的横幅在div 3仍然是全屏的宽度？ – 2015-03-31 08:55:57

我不知道。你可以垂直居中你的图像，但是如果你使用GRID，我没有办法解决这个问题。你或者需要拉伸你的形象，这会让它变得丑陋，或者让左边的字体变得很小。 – Robin 2015-03-31 08:58:58

答

如果您正在使用jQuery你可以做这样的事情

$(window).on('resize', function() 
{ 
    // NOTE: You will need to give your divs ids. 
    // I have given div 1 id = "div-1" and div 2 id = "div-2" for the purpose of this answer. 
    var height = $('#div-1').height(); 
    $('#div-2').css('height', height); 
});

什么，将要做的就是设置正确的股利左div的高度的高度，给他们同样的高度。你也可以把字体大小和字母间距放在里面。

如何使敏感div高度？

相关推荐