Header and navigation bar look weird in IE

  • Resolved sbgloss

    (@sbgloss)


    10 years, 7 months ago

    I’ve read through a lot of posts on this issue, but still can’t figure it out. My header and navigation bar look squashed and messed up in IE, but look normal in Chrome, Safari, Opera, and Firefox… with the one exception: the images in my nav bar aren’t completely centered, but I’m willing to live with that unless someone can point me to an easy fix. In IE, though, the images get spread out and go onto 2 lines rather than one.

    I’ve run validation check on the site and I know I have some errors, but I’m not sure how to zero in on and fix this particular issue. Any suggestions on how to fix the header and navigation bar so that they appear better on IE would be greatly appreciated!

    http://www.thedebutanteball.com

Viewing 8 replies - 1 through 8 (of 8 total)
  • WPyogi

    (@wpyogi)

    10 years, 7 months ago

    Start with fixing the break tags that are incorrect –

    http://validator.w3.org/check?uri=http%3A%2F%2Fwww.thedebutanteball.com%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

    Thread Starter sbgloss

    (@sbgloss)

    10 years, 7 months ago

    Thank you. I corrected the break tabs, I think, and that brought down my error count. But the navigation bar and header are still looking funny on IE.

    WPyogi

    (@wpyogi)

    10 years, 7 months ago

    What version of IE are you using? You tagged this with IE8? That’s pretty outdated and not widely supported any longer so you may need to add special conditional CSS for that to work well…

    You also really should not have the entire parent style.css file in the child theme – it makes it much harder to manage your CSS and keep track of what you have changed.

    Thread Starter sbgloss

    (@sbgloss)

    10 years, 7 months ago

    I tested it out in IE8. I hate IE8, but it’s what I have on my dinosaur work computer (running Windows XP) so I pulled up the site there just to see what the blog looked like and the header and nav bar showed up all weird. I’ve read about the conditional CSS stuff, but can’t decide if its worth it to do that for IE8 or if I should just add a site warning for IE8 for the few people who still use it. Or to just live with how terrible it looks, considering it looks fine everywhere else.

    Thanks for the tip about the child/parent theme. That makes sense.

    esmi

    (@esmi)

    10 years, 7 months ago

    Conditional comment CSS would work for IE8 but given that this browser’s CSS box model was still very badly borked, it’s likely to involve a fair amount of work. :-/

    Thread Starter sbgloss

    (@sbgloss)

    10 years, 7 months ago

    That’s all I needed to hear. I think I’ve decided it’s not worth the headache. The site looks fine everywhere else.

    Thank you!

    WPyogi

    (@wpyogi)

    10 years, 7 months ago

    LOL – I was gonna say essentially the same thing… RIP IE8 (and below).

    Thread Starter sbgloss

    (@sbgloss)

    10 years, 7 months ago

    Also, thank you WPyogi for the tip about paring down my child theme style.css. I pared it down from over 1200 lines to less than 200! My site is still less than perfect, but at least I have a lot fewer things to look at now.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Header and navigation bar look weird in IE’ is closed to new replies.