Sam
Sam

Reputation: 1586

Float padding causing float to expand

I am creating a simple 2 column layout for a website, but have struck a bit of a problem. When I add padding to the column which has float:left applied, the float expands past the width I have defined. I can't seem to find an answer for this anywhere.

Upvotes: 0

Views: 81

Answers (1)

David Anderson
David Anderson

Reputation: 13690

You have to adjust the width, because when your page is rendered padding is considered as part of the width.

Say you have a div that should be 200px, with a rightward padding of 10px.

.box {
    width:200px;
    padding-right:10px;
}

Your actual width will be 210px.

Upvotes: 1

Related Questions