Question

I tried using padding:10px to this example but it makes the div move to the left. Any solutions you might think?

Answer 1

That’s because the width does not include any padding or margin you might have on the element. You’ll need to subtract the 40px from your total width size to keep it the same size.

Try this:

.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/

Edit: If you want, you can use padding: 15px 20px, I think it looks better and it’s better centered.