Padding problem Options

[msucimaster]

Thanks for solving my last problem. I have a new issue that puzzles me.

Inside a div I want to have a colored bar over the full width. Inside this bar I have some text. That text should be to the left with some margin.

It is that margin that gives me a problem. I try to assign it with padding-left. It works for the text. Unfortunately a side effect is that bar grows with the size of the padding and now goes over the boundary of the enclosing div.

What am I doing wrong?

The code I have is:

<div class="subBar">My Text</div>

div.subBar
{ width: 100%;
height: 28px;
margin-top: 20px;
font-size: 20px;
text-align: left;
padding-left:120px;
background: #ee7;
}