嗨，我如何让 div 'one' 和 div 'three' 自动调整到屏幕一侧，同时在 css 中保持 div 'two' 宽度静态？所有三个 div 应该在同一行中
我的 HTML 是这样的；
<html>
<header<title></title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="x">
<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
</div><!-- close div 'x' -->
</body>
</html>
目前完成的CSS如下；
#x {height:34px; border:1px solid gray;}
#one {height:30px; border:1px solid red;; width:auto; float:left;}
#two {height:30px; border:1px solid green; width:660px; float:left;}
#thr {height:30px; border:1px solid blue; width:auto; float:left;}
非常感谢任何建议。感谢观看
最佳答案
你可以这样做My Fiddle
HTML
<div class="container">
<div class="first"></div>
<div class="static"></div>
<div class="third"></div>
</div>
CSS
.container {
display:-webkit-box;
-webkit-box-orient:horizontal;
-webkit-box-align:stretch;
display:-moz-box;
-moz-box-orient:horizontal;
-moz-box-align:stretch;
display:box;
box-orient:horizontal;
box-align:stretch;
color: #ffffff;
}
div {
height: auto;
}
.first {
background-color: #546547;
}
.static {
background-color: #154d67;
width: 660px;
}
.third {
background-color: #c00000;
}
.first, .third {
-webkit-box-flex:1.0;
-moz-box-flex:1.0;
box-flex:1.0;
}
关于html - 如何自动调整左/右 div 标签宽度以适应屏幕，同时保持中间 div 宽度不变，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12766567/