我似乎无法让我的 div 在 div 内并排对齐,谁能看出问题出在哪里?我试图将 divContainer 元素的高度设置为 buttonPanel 元素和并排放置的 2 个 testDiv 元素。我还尝试使用 float: left 设置 testDiv 元素,但这也不起作用。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="MSThemeCompatible" content="Yes" />
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<title>Test</title>
<style type="text/css">
* {
font-family: tahoma;
font-size: 8pt;
}
#buttonPanel {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
text-align: right;
background-color: buttonface;
}
#buttonPanel hr {
margin: 0;
}
#buttonPanel button {
margin: 10px;
width: 75px;
}
#divContainer {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 45px;
border: 2px solid #FFFF00;
}
.testDiv {
display: inline-block;
width: 50%;
height: 100%;
border: 2px solid blue;
}
</style>
</head>
<body>
<div id="divContainer">
<div id="test1" class="testDiv">test1</div>
<div id="test2" class="testDiv">test2</div>
</div>
<div id="buttonPanel">
<hr/>
<button id="btnOK">OK</button>
<button id="btnCancel">Cancel</button>
</div>
</body>
</html>
最佳答案
举个例子:
你有两个 div,左-div 说 ldiv,右-div 说 rdiv。这些 div 在 main-div 里面,说 mdiv 即
<div class = "mdiv">
<div class="ldiv">
</div>
<div class="rdiv">
</div>
</div>
那么你的css应该是这样的:
#mdiv{}
#ldiv {float:left;}
#rdiv{ float:left;}
关于css - 在主容器 div 中并排 div 不对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24545006/