<分区>
当 .content
宽度与 .box
并且不小。
.box {
width: 95%;
background-color: red;
padding: 20px;
text-align: center;
margin: 55px auto 40px;
}
.content {
display: inline-block;
text-align: center;
width: 530px;
height: 500px;
padding: 57px 40px 0;
background-color: #e9e9e9;
height: 800px;
box-sizing: border-box;
}
<div class="box">
<div class="content">
<img src="images/image.png" alt="">
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/main.js"></script>
最佳答案
将 width
设置为 100% 并添加 min-width: 530px;
如果宽度不是,您的 .content
将缩放 小于 .box
.box {
width: 95%;
background-color: red;
padding: 20px;
text-align: center;
margin: 55px auto 40px;
}
.content {
display: inline-block;
text-align: center;
min-width: 530px;
width:100%;
height: 500px;
padding: 57px 40px 0;
background-color: #e9e9e9;
height: 800px;
box-sizing: border-box;
}
<div class="box">
<div class="content">
<img src="images/image.png" alt="">
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/main.js"></script>
关于html - Div 内容不应自动缩放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40891230/