我希望 div 在视口(viewport)宽度较小时最大化尺寸,并在视口(viewport)宽度较大时减小尺寸(最大最小值)。
如何实现?
.outer {
outline: 1px solid red;
height: 128px;
min-width: 50%;
/* width: ???; What to set here to achieve the effect? */
margin: auto;
}
<div class="outer">
</div>
我尝试修改 padding 而不是 width,但它仍然与将 width 设置为 % 值的效果相同。
.outer {
outline: 1px solid red;
height: 128px;
width: 100%;
padding: 0 10vw;
}
<div class="outer">
</div>
最佳答案
您可以按照 width: calc(500px - 20vw)
的方式进行操作。当窗口较小时,vw
将最小(创建较大的值),而在大窗口中则相反。
关于css - 在较大的父宽度上减小 div 宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45315563/