我正在开发一个项目,该项目使用同一个类的几个div,每个div包含一个子元素,可能是一个未指定高度的图像或iframe.我希望容器div正好是其子元素的高度,但默认高度比子高3px.
我有一个JSfiddle在http://jsfiddle.net/52me041n/2/演示了这个问题.
HTML:
<div class="outside"> <img class="inside" id="pic" src="https://images.duckduckgo.com/iu/?u=http%3A%2F%2Fblogs.cisco.com%2Fwp-content%2Fuploads%2Fclouds.png&f=1" height="200px"/> </div> <br/> <div class="outside"> <iframe class="inside" width="420" height="315" src="//www.youtube.com/embed/VwTnyRHEZSQ" frameborder="0" allowfullscreen></iframe> </div>
CSS:
.outside{ background-color: red; }
我想知道是否可以用CSS将div设置到合适的高度,如果没有,如何用JS来改正它.