在2格中水平分割屏幕

我想在html中设置一个div并设置剩余空间的第二个div ..我想这很简单，但我很难做到这一点。在2格中水平分割屏幕

我想设置一个div固定的高度，使第二，剩余的空间，这样的事情：

<div class="div1">1st</div> 
<div class="div2">2nd</div>

CSS：

div.div1{background: #999; height: 78px;} 
div.div2{ background: #666; height: (remaining_space); }

这是可能的吗？

来源

2013-07-23 thur

退房http://stackoverflow.com/questions/90178/make-一个-DIV填充最剩余屏幕空间？RQ = 1 –

正如其他SO用户所说，没有跨浏览器的方式只能使用CSS。虽然我注意到，你没有跟javascript标记您的问题，我会使用jQuery

建议为你解决

$(document).ready(function() { 
    var docHeight = $(document).height(); 
    var div1Height = $('.div1').height(); 
    var div2Height = docHeight - div1Height; 
    $('.div2').css('height', div2Height); 
});

http://jsfiddle.net/FakeHeal/TjPQ6/

来源

2013-07-24 00:00:45

目前没有跨浏览器的方式只用CSS来做到这一点。为了在所有浏览器上都能正常工作，您需要使用JavaScript。如果您希望处于最前沿，只支持最新的浏览器，您可以查看IE10's grid layout。

来源

2013-07-23 23:51:42 Jeff

在2格中水平分割屏幕

回答

相关问题