Floats with percentage points and borders


I have two elements that I want to float beside each other, which I can do, and would normally have no problem with setting them in pixels. However, I now have a content area set at 100% the remaining width of the window, and I want the two floats to be split so that they take this area up to fit in with borders and the design of the site. However, I set the widths to 50% each, whilst the elements had padding and a border. Of course, they wouldn’t float as both had borders, so I set the padding to 1% and widths to 48% and they floated. Of course, now the border is difficult, because it appears it can’t be sent in percentage points. I also do not like setting the padding like this, as other elements that do not need to be floated like this have padding set in pixels, making these two boxes look ugly.

Are there any solutions to this type of problem, or am I forced to pick a size to be pixel perfect, or lose my requirement for perfectly lined up?



I’ll take that as a no to solving my problem using borders in CSS then by usage of the border property?

You could put the border as a background image and not worry about the whole measuring mess :slight_smile: