The front page of my site looks perfect (to me) in Safari, and Firefox. When I look at in in Internet Explorer (7,8,9) the 2 x 2 div's are not equal height.
What am I missing?
My site is here: https://www.algxchange.com/home
Fixed- I was missing these:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
slf's link will be helpful to you. In essence, IE, in its infinite wisdom, decided to be different from the rest of the browser world, and include any padding and/or border to the width (or height, in this case) specified in the CSS. So, in every other browser, a box with 70px height and 5px padding on top will be 75px. In IE, it will be 70px (the box would be 65px, and then the 5px padding).
In a way, it kind of makes sense, but it's irresponsible of Microsoft to stick to it in the face of the W3C spec that says otherwise.