如何在html中使用相同高度的浏览器制作两个div [英] how to make two div with same height of browser in html
问题描述
如何制作两个高度相同的div，两个div的高度都是屏幕尺寸，两个div并排显示
喜欢Outlook菜单和电子邮件列表
我不想使用Jquery。
请帮帮我
How can I make two div with same height and both div have height as screen size and both div show as side by side
Like Outlook Menu and Email List
I don't want to use Jquery.
Please Help me
推荐答案
不确定这是否是你需要的，这样做是将div并排放在体内，并占据身体的100％高度。
以下是使用CSS和HTML执行此操作的一种方法：
Not sure if this is what you require, what this does is put the divs side by side inside the body, and takes up 100% height of the body.
Here is one way of doing it using CSS and HTML:
html,body{
height:100%;
width:100%;
}
body{
margin: 0 0 0 0;
padding:0 0 0 0;
}
div{
box-sizing: border-box;-moz-box-sizing: border-box;
height:100%;
width:50%;
display: inline-block;
}
注意：div之间没有空格。
Note: no whitespace between the divs.
<body>
<div style="border:solid 2px green;">AAA</div><div style="border:solid 2px blue;">BBB</div>
</body>
如果这不是您所需要的，我建议谷歌并排搜索div和屏幕高度或类似的东西。
为了替代方法，请查看div的这些链接：
http://stackoverflow.com/questions/2156712 / how-to-float-3-divs-side-by-side-using-css [ ^ ]
http://stackoverflow.com/questions/17217766/two-divs-side-by-side-fluid-display [ ^ ]
并排没有浮动：
http://stackoverflow.com/questions/3619233/div-side-by-side-without-float [< a href =http://stackoverflow.com/questions/3619233/div-side-by-side-without-floattarget =_ blanktitle =New Window> ^ ]
If this is not what you require, I suggest googling div side by side and div to screen height or something similar.
Check out these links for div side by side for alternative methods:
http://stackoverflow.com/questions/2156712/how-to-float-3-divs-side-by-side-using-css[^]
http://stackoverflow.com/questions/17217766/two-divs-side-by-side-fluid-display[^]
Side by side no float:
http://stackoverflow.com/questions/3619233/div-side-by-side-without-float[^]
这篇关于如何在html中使用相同高度的浏览器制作两个div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
