正确的文本填充

Question

我尝试使用填充:10px到这个例子,但它使div移动到左边.您可能会想到任何解决方案

Answer 1

这是因为宽度不包括元素上可能包含的任何填充或边距.您需要从总宽度大小中减去40px,以使其保持相同的大小.

试试这个:

.promo {
    color:#5f5f5f;
    width:240px;
    height:74px;
    background:url('http://i27.lulzimg.com/e1de57065d.png') no-repeat;
    float:right;
    display:block;
    margin-top:20px;
    padding: 20px;
}

http://jsfiddle.net/animuson/NncNE/3/

编辑:如果你想,你可以使用padding: 15px 20px,我认为它看起来更好,它更好地居中.