Correcting 100% Width Problem with Anchors

Question

Ok, so I have a class that modifies the looks for a specific type of anchor that I'm using, but the problem is that the browsers keep adding the 30 pixels of padding that I have set onto the defined 100% width, so it's stretching out past the box which the anchor is located in.

div.box div div div a.option_line {
cursor: pointer;
display: block;
font-weight: normal;
min-height: 30px;
padding: 0px 10px 0px 20px;
text-align: justify;
width: 100%;
}

As seen here: http://animuson.com/community

Can anyone think of a way to make the anchor stay within the boundaries of the box?

Answer 1

Just take out the width: 100%, as the a is declared to be a block level element, it will stretch to the maximum width available without going over.

Answer 2

Remove the width:100%; that caused the issue, since you already set the display to 'block' the width:100% isn't necessary because block elements occupies the available width of the container