How can I fix this page for Internet Explorer? It seems to add a space below the background images for some reason..
The design is like this:
------------------
| TOP IMAGE |<- base_top.png
------------------
| | | |
base_sides.png ->| | CONTENT | |<- base_sides.png
| | | |
|-----------------
| BOTTOM IMAGE |<- base_bottom.png
------------------
It’s because IE has the strange idea that every element should be at least one character high.
If you add
overflow:hidden;to the #top and #bottom styles, that will keep IE from making the element larger than you have specified.General tip:
Adding a proper doctype to the page so that it renders in standards compliant mode helps a lot with how IE renders the page.
W3C: Recommended list of DTDs