html - 图像超出容器 div 边界

标签 html css

谁能看看下面的 fiddle :http://jsfiddle.net/R4bCy/1/

我认为 div 应该调整它的高度以适应它的元素,除非元素是绝对定位的。

为什么 div 没有扩展到图像的整个高度?

我需要图像右对齐。我知道如何做到这一点的唯一方法是 align='right', position:absolute; right: 0;float:right,所有这些都使得包含的 div 不会将其高度调整为图像高度。

最佳答案

.intro {
margin: 10px;
outline: 1px solid #CCC;
background: #A00;
color: #FFF;
height:auto;
overflow:auto;
}
​.img{
float:right;
height:auto;
}​

<div class="intro">
    <div class="img"> <img src="http://1.bp.blogspot.com/_74so2YIdYpM/TEd09Hqrm6I/AAAAAAAAApY/rwGCm5_Tawg/s1600/tall+copy.jpg"    style="margin: 10px 10px; "/></div>

  <p>Sorry, but the page you requested could not be found.</p>
</div>​​​​​​​​​​

DEMO

关于html - 图像超出容器 div 边界,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12695726/

相关文章:

javascript - 如何在不将 overflow-x 更改为 auto 的情况下使 overflow-y 滚动?

html - 如何使用 css 和 html 排序产生从 1.1、1.2、1.3(而不仅仅是 1、2、3)开始的结果的列表

html - CSS3 Firefox 边框半径剪辑

html - 在 <a> 标签内调整图像大小

html - 居中子菜单 CSS 和 HTML

html - 显示与导航内联的图标

javascript - 隐藏主体溢出时固定位置移动的元素

html - 试图把文字放在图片下面会弄乱对齐

css - 如何使用 bootstrap 3 将导航菜单项居中?

javascript - 使用 JavaScript 从 iframe 读取数据