如何在同一水平
带内盒我想内两个div被定位为:_________ _________ | | | | | | | | | | | | | _________ | | | | | | _________ |如何在同一水平
现在发生的事情是,当他们都是空的,或者其中的数据是纯文本简单那么它看起来像这只。但是,当我使用
,如果我用更多的边距在他们内部制作更多的div,那么较短的高度框开始下降。但我想让第一个盒子停滞在它的位置。
P.s.我已经绘制了啪嗒啪嗒的样子,但如果在发布此问题后发生扭曲,请运行代码。
<html>
<head><title>abc</title>
<style>
\t #biggerbox{
\t \t width: 1200px;
\t \t margin: 0 auto;
\t \t padding-top: 100px;
\t \t text-align: center;
\t \t border: 1px solid;
\t }
\t #first{
\t \t width: 500px;
\t \t height: 600px;
\t \t display: inline-block;
\t \t border: 1px solid;
\t }
\t #second{
\t \t width: 500px;
\t \t height: 800px;
\t \t display: inline-block;
\t \t border: 1px solid;
\t }
</style>
</head>
<body>
\t <div id="biggerbox">
\t \t <div id="first">
\t \t \t This is first box
\t \t </div>
\t \t <div id="second">
\t \t \t This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>
\t \t </div>
\t </div>
</body>
</html>
\t
<html>
<head><title>abc</title>
<style>
#biggerbox{
width: 1200px;
margin: 0 auto;
padding-top: 100px;
text-align: center;
border: 1px solid;
}
#first, #second{
width: 500px;
height: 600px;
display: inline-block;
border: 1px solid;
vertical-align: top;
}
</style>
</head>
<body>
<div id="biggerbox">
<div id="first">
This is first box
</div>
<div id="second">
This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>This is second box
<br>
</div>
</div>
</body>
</html>
更新CSS
的CSS
#biggerbox{
width: 1200px;
margin: 0 auto;
padding-top: 100px;
text-align: center;
border: 1px solid;
display: inline-block;
}
#first{
width: 500px;
height: 600px;
float:left;
border: 1px solid;
}
#second{
width: 500px;
height: 800px;
float:left;
border: 1px solid;
}
.center
{
text-align: center;
display:inline-block;
margin: auto;
}
但我希望他们能中心对齐以及当浏览器窗口大小 –
我已经更新了我的答案...尝试 –
日Thnx您的帮助,但再次与类中心整个DIV是左对齐...的在垂直align:top服务于此目的 –
使用float:left
在每个DIV的CSS。
我没有得到任何东西。你可以请更多解释,如果你想向我们展示一些设计,然后提供图像。 –