我使用CSS :在之前和:在之后使用div创建类似布局的纸张。它很好但宽度随着高度的增加而增加。我尝试过 max-width ,但无济于事。关于如何防止这种情况的任何想法。
HTML
<div class="rack"></div><!-- End Rack -->
CSS
.rack {
width: 70%;
height: 100%;
background: #7FAE68;
margin: -255px 0 100px 0;
position: relative;
float: left;
left: 15%;
z-index: 9999;
transform:rotate(1deg);
-ms-transform:rotate(1deg);
-webkit-transform:rotate(1deg);
padding-bottom:50px;
}
.rack::before {
content: "";
background: #E1BB70;
position: absolute;
height: 100%;
width: 100%;
z-index: -2;
transform:rotate(1deg);
-ms-transform:rotate(1deg);
-webkit-transform:rotate(1deg);
float: left;
left: 0%;
}
.rack::after {
content: "";
background: #E5E8EC;
position: absolute;
height: 100%;
width: 100%;
z-index: -1;
transform:rotate(-1deg);
-ms-transform:rotate(-1deg);
-webkit-transform:rotate(-1deg);
border: solid 1px #ddd;
left: 0%;
}
高度增加之前
高度增加后
将小提琴中的内容加倍,以见证问题。
答案 0 :(得分:0)