我有主div和里面,我有3个divs,每个都有单独的百分比宽度。所以我分别获得了20%,80%和100%的div。 与他们合作到目前为止,我意识到,如果我已经给出了200%的宽度,那么它将浏览器宽度分成两个相等的部分,前半部分被认为是100%,另一半则是100%。然后发生其余的百分比分配。我是CSS新手,但想清楚说明。我的理解是否正确,这就是为什么我的代码工作正常?这样做有什么不利吗?如何将百分比宽度分配给div?
.main {
font-size: larger;
font-weight: bold;
}
.column1 {
position: relative;
line-height: 30px;
width: 20%;
text-align: left;
}
.column2 {
width: 80%;
}
.column3 {
position: relative;
width: 100%;
float: right;
text-align: right;
}
.clear-both {
clear: both;
}
.row {
border-width: 2px;
border-bottom-color: #f4f4f4;
border-style: none;
position: relative;
line-height: 30px;
border-bottom-style: solid;
margin-top: 0.2%;
font-weight: normal;
font-size: 12px;
display: flex;
}
<div class="row main">
<div class="column1">CODE</div>
<div class="column2 ">NAME</div>
<div class="column3">TOTAL</div>
</div>
这里有什么问题,你想达到什么? –
我得到了我想要的,即我想要这3列在一行。但我不确定这是否是正确的方式来做到这一点,如果我以这种方式做到这一点,是否有任何可能会打破用户界面,因为我的总宽度是200%? –
保持你的父母div 100%不是200%。200%像宽度是水平网站或滑块像东西 –