0
目前，我正在尝试学习移动设备的响应式设计。我遇到的问题是，在增加浏览器大小时，我的图像缩放得很好。但是，他们倾向于超出包含文本的框。我会提供一张照片，以便您可以看到问题所在。图片移动设备响应设计
如果任何人有任何想法，如何缩放功能，从而真正帮助时要妥善保管内部div的图像！谢谢！
而且，这里是我的jsfiddle：https://jsfiddle.net/x1mn04p2/（我放在上面的IMG CSS和下方，该网站的CSS的休息，这样我可以得到充分的样子）
HTML：
<section>
<div id="box">
<h1> GCOM 366</h1>
<section class="clearfix" id="primary">
<div class="imgbox">
<img class="adjustable" src="weblogo" alt="example web page" width="300" heigh="300" style="float:right">
</div>
<h2> Benefits</h2>
<p class="side">
1. Learn industry standard programs
<br>
2. Build Portfolio
<br>
3. Increase collaboration skills
<br>
4. Become more creative
<br>
5. Understand good layout
<br>
6. Feel confident in HTML/CSS
</p>
</section>
img.adjustable{
width: 100%;
max-width: 400px;
max-height: 400px;
margin: 1em 1em 1em 2%;
}