边界出 DIV (borde fuera de div)答案

【问题标题】：Border out DIV (borde fuera de div)边界出 DIV (borde fuera de div)
【发布时间】：2015-10-30 02:27:45
【问题描述】：

我在 CSS 中遇到属性 Padding 或 Border 的问题。我在 div 中有一个非常适合的图像，但是添加边距超出了包含它的 div。

<div class="content">
    <div class="row" />
    <div class="ima">
        <h1>Titulo 1</h1>
        <img class="img" src="https://sites.google.com/site/cnetuc/imagen-04.jpg" />
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas laoreet mattis arcu eget euismod. Donec eget purus et enim cursus feugiat sit amet in diam.
            <p>
    </div>
    <div class="ima">
        <h1>Titulo 1</h1>
        <img class="img" src="https://sites.google.com/site/cnetuc/imagen-04.jpg" />
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas laoreet mattis arcu eget euismod. Donec eget purus et enim cursus feugiat sit amet in diam.
            <p>
    </div>
    <div class="ima">
        <h1>Titulo 1</h1>
        <img class="img" src="https://sites.google.com/site/cnetuc/imagen-04.jpg" />
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas laoreet mattis arcu eget euismod. Donec eget purus et enim cursus feugiat sit amet in diam.
            <p>
    </div>
</div>
</div>

附fiddle

【问题讨论】：

box-sizing: border-box; 对你有用吗？
谢谢可可，如果它有效！ :)

标签： html css margin padding

【解决方案1】：

在图片中添加box-sizing: border-box;。

.ima img{
  width:100%;
  border:10px solid rgba(0, 0, 0, 0.3);
  box-sizing: border-box;
}

【讨论】：

【解决方案2】：

尝试

box-sizing: border-box;

或者

width: calc(100% - 20px);

【讨论】：

嗯有趣的功能