Help with IE8 and IE 7 issues

I built a new wordpress layout and basically just used their layout and changed some colors and a little styling. Well apparently I wasn’t checking my updates in IE8 and IE7 when I was doing the design. I was only checking it in Chrome, IE9, firefox. So everything looks good in those browsers. But in IE 8 and 7 the menu is all funked up. Can someone help me and take a look at the code and see where my mess up is or if I need to write conditional statements for those two browser versions?

familydentalhealthonline.com

Hi. I looked at your source code and it is checking for IE less than (earlier than) version 9. If it is earlier than version 9, then it is using a different CSS. So you just need to style this CSS file the same way you styled the other one: http://familydentalhealthonline.com/wp-content/themes/twentytwelve/css/ie.css

FYI, here’s the command that was in your file:

<!–[if lt IE 9]>
<link rel=‘stylesheet’ id=‘twentytwelve-ie-css’ href=‘http://familydentalhealthonline.com/wp-content/themes/twentytwelve/css/ie.css?ver=20121010’ type=‘text/css’ media=‘all’ />
<![endif]–>

If your theme is based on twentytwelve it won’t work well in IE<9. Twentytwelve uses a mobile first responsive design methodology which doesn’t have support for older IE.

If this is the case you can either:

  1. Work on modifying the CSS to deliver desktop version of the site for IE styles E.g.
    .ie .previousClassName { proprety: style; }
  2. Modify twentyeleven instead. It is responsive but looks like it behaves better in IE

I am working on this on a desktop version myself but haven’t decided if I will stick with it.

I didn’t even realize it was looking at a separate CSS file for IE 8 and 7. I love twenty twelve and the responsive design. I hate designing for IE. But anyways I got it looking decent now in IE 8 and 7. But one thing that is bugging me, on the home page, scroll down to the 3 boxes that are next to each other. They look fine in all browsers. But in IE 8 and 7 the last box is pushed down like 20px? I mean wtf? garbage browsers, but people still use them so I have to fix things like this.