我正在试验css。我正在使用 left 属性构建一种两列布局，但我遇到了麻烦。我不明白，因为当我缩小页面时，右列(div.right(的内容会下降。我错在哪里？
body,
html {
height: 100%;
}
.sinistra {
float: left;
width: 47%;
margin: 1.5%;
margin-right: 0%;
padding-right: 1.4%;
text-align: justify;
border-right: thin dotted;
height: 90%;
}
.destra {
float: right;
width: 47%;
margin: 1.5%;
text-align: justify;
word-wrap: break-word;
height: 90%;
}
.piede {
background-color: grey;
}
.fix::after {
content: "";
clear: both;
display: table;
}<div class="fix">
<div class="sinistra">Lorem ipsum dolor sit amet, cum omnium accumsan at, usu accusam legendos consequat at. Feugait tractatos adipiscing nam ad. Ius no oratio deseruisse, nec quaestio repudiare argumentum ne. Cu erant essent sed. Usu facete invenire argumentum ex, ut sint
brute discere his. Enim veri praesent at sea, vis ex utroque detraxit partiendo. Ex est suscipiantur voluptatibus. An has rebum offendit. Mei ut ocurreret laboramus, quas aperiam ponderum ut vix. Alterum nonumes et pri. Te agam incorrupte mea, ei
eum utroque efficiendi. Sit mundi dolorem detraxit ea, ea vel quem principes. Ad volutpat sadipscing quo, labore maiorum ex eos. Per solum omnium graecis in, ea sea iisque commodo. Ne invidunt sapientem duo, sit ex stet clita luptatum. Errem diceret
constituam id pro. No usu recusabo voluptaria. Mei mollis docendi convenire ut, mel cu cibo appareat evertitur.Lorem ipsum dolor sit amet, cum omnium accumsan at, usu accusam legendos consequat at. Feugait tractatos adipiscing nam ad. Ius no oratio
deseruisse, nec quaestio repudiare argumentum ne. Cu erant essent sed. Usu facete invenire argumentum ex, ut sint brute discere his. Enim veri praesent at sea, vis ex utroque detraxit partiendo. Ex est suscipiantur voluptatibus. An has rebum offendit.
Mei ut ocurreret laboramus, quas aperiam ponderum ut vix. Alterum nonumes et pri. Te agam incorrupte mea, ei eum utroque efficiendi. Sit mundi dolorem detraxit ea, ea vel quem principes. Ad volutpat sadipscing quo, labore maiorum ex eos. Per solum
omnium graecis in, ea sea iisque commodo. Ne invidunt sapientem duo, sit ex stet clita luptatum. Errem diceret constituam id pro. No usu recusabo voluptaria. Mei mollis docendi convenire ut, mel cu cibo appareat evertitur. Ius aperiri gloriatur ne,
est ei quaestio pertinacia disputationi, cum eu omnis delectus antiopam.…</div>
<div class="destra">
Lorem ipsum dolor sit amet, cum omnium accumsan at, usu accusam legendos consequat at. Feugait tractatos adipiscing nam ad. Ius no oratio deseruisse, nec quaestio repudiare argumentum ne. Cu erant essent sed. Usu facete invenire argumentum ex, ut sint
brute discere his. Enim veri praesent at sea, vis ex utroque detraxit partiendo. Ex est suscipiantur voluptatibus. An has rebum offendit. Mei ut ocurreret laboramus, quas aperiam ponderum ut vix. Alterum nonumes et pri. Te agam incorrupte mea, ei
eum utroque efficiendi. Sit mundi dolorem detraxit ea, ea vel quem principes. Ad volutpat sadipscing quo, labore maiorum ex eos. Per solum omnium graecis in, ea sea iisque commodo. Ne invidunt sapientem duo, sit ex stet clita luptatum. Errem diceret
constituam id pro. No usu recusabo voluptaria. Mei mollis docendi convenire ut, mel cu cibo appareat evertitur.Lorem ipsum dolor sit amet, cum omnium accumsan at, usu accusam legendos consequat at. Feugait tractatos adipiscing nam ad. </div>
</div>
<div class="piede">Piede</div>jsfiddle 上的代码
考虑在.sinistra上使用box-sizing:border-box并调整宽度以补偿边框的粗细，并将.sinstra上的填充更改为 1.5%。
.sinistra {
float: left;
width: 48.5%;
margin: 1.5%;
margin-right: 0%;
padding-right: 1.5%;
text-align: justify;
border-right: thin dotted;
height: 90%;
box-sizing: border-box;
}
更多阅读： https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing
在代码中添加box-sizing: border-box;，最好这样：
body * {
box-sizing: border-box;
}