I'm having issues with bellavitapilates.com

Firefox and Safari render the page correctly but in IE the text spacing is wrong.

What is the best fix for this?

2 answers

Emily G 620

You are using absolute positioning to create the two columns. Absolute positioning takes the elements out of the flow of the document meaning they will not take up any space. You should try using floats instead

.twocolumn {overflow:hidden; zoom:1;}    //to clear the floats
.col1 {float:left; width:355px;}
.col2{float:right; width: 310px;}
Answered about 8 years ago by Emily G

For what you are trying to achieve you should try using border-bottom on the LI's instead of the HR's. Then adjust your top and bottom padding/margins. It seems that the styling on the HR's is inconsistent between browsers. To get the bullets to display better, you should add about 24px of padding to the left side of the UL. You can always set the last LI to "border:0" inline to remove the last border.

Answered about 8 years ago by Efficient Pixel