容器左边不可见。
我正在使用圣杯布局技术。
如何正确设置?如何对齐它们?
当我删除
margin-left : -100%
后,容器左侧显示出来,但它与其他中心和右侧容器不对齐。在 CSS 文件 (*) 中,我读到过这个问题的解决方法,当左侧宽度为负且消失时,我们可以采取以下措施以达到视觉效果。
* {
margin: 0;
padding: 0;
}
body {
min-width: 630px;
}
.container {
padding-left: 200px;
padding-right: 190px;
overflow: hidden;
}
.container .column {
position: relative;
float: left;
}
.center {
padding: 10px 20px;
background-color: chartreuse;
width: 100%;
}
.left {
background-color: aqua;
padding: 10px 10px;
width: 180px;
right: 240px;
margin-left: -100%;
}
.right {
background-color: blueviolet;
padding: 10px 10px;
width: 130px;
margin-right: -190px;
}
.footer {
clear: both;
}
* html .left { /* (*) */
left: 150px;
}
<header class="header">Header</header>
<div class="container">
<div class="left column">Container Left</div>
<div class="center column">Container Center</div>
<div class="right column">Container Right</div>
</div>
<footer class="footer">Footer</footer>