Question

20分！width100%后加上margin和padding超出父元素

在图片上显示文字的span的属性如下
position: absolute;
left: 0px;
bottom: 0px;
background-color: rgba(0, 0, 0, 0.74);
color: #FFF;
font-size: 15px;
padding: 6px;
margin-bottom: 6px;
margin-left: 6px;
margin-right: 6px;
width: 100%;

HTML结构如下
<div class="g-item">
<img src="images/gallery/g1.jpg" alt="">
<span class="title">测试啊</span>
<a data-rel="lightbox" class="overlay" href="images/gallery/g1.jpg">
<span class="go">+</span>
</a>
</div>

其实我就是想把文字放在白框以内，直接父元素的CSS是
.g-item {
margin-bottom: 30px;
padding: 6px;
position: relative;
background-color: white;
overflow: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}

求怎么把右边超出去的缩回去..

Answer 1

你父类没有设置width 弄成auto试一试
还有，如果父元素width是固定的 ，那么你span要算一下盒子的总宽度，就是width加上两边margin 和padding，是不是超出了想要的范围

追问

auto无效啊，父元素也不是固定的，都是百分比