CSS problems with IE

  • After three days trying out all sorts of different things I’ve pretty much got my blog how I want it. The only problem is that the menu div drops below the content div on the comments page when viewed in Internet Explorer. Note that this only happens on the comments page and not the main page. I’m using Mac OS X so I don’t know how it looks in IE on Windows but I’m assuming IE renders the same regardless of the OS. The page looks fine in both Firefox (although I haven’t tested Firefox in Windows) and Safari.
    I have looked thoroughly through both the wp-comments.php file and my wp-layout.css file but I can’t for the life of me work out what the problem is. I would appreciate any kind of help.
    You can see my site at https://petelawley.com and my css file at https://petelawley.com/wp-layout.css. If anybody needs to look at my wp-comments.php file please let me know.

Viewing 5 replies - 1 through 5 (of 5 total)

  • It would probably help if we could actually see the problem…
    When I go to your site, it just says that no posts matched my criteria, so it’s kind of hard to see the comments page where the problem occurs ??
    Can you write a test post for us?

    Well you have nested two content floats. One of them has 20px padding. Adding padding or borders to a fixed width element causes mysteriousness in IE browsers and I would eliminate it or you will need to apply a hack. Secondly the last tag I can see for the whole page looks like a close li . Probably an oversight.
    Finally on the comments section I can see no footer. They can act as *anchors*
    which hold float position schemes together. Just some thoughts. HTH.

    Thread Starter petelawley

    (@petelawley)

    Sorry Oisin, I’d deleted all my test posts because I was about to write my first ‘real’ post. I wasn’t expecting a response so soon.
    Root: If I don’t use margins or padding in my CSS what other way is there to stop the text from sitting right up against the edge of the div frame? I know a reasonable amount about CSS but I’m no expert.

    Well the common solution is to keep the floated div clean with the width only. Period. Then nest another div without a width declared inside it . On that div you can set margins and padding all you like. The default template has a ul at the outset. You can set your style up there without disturbing the parent menu container. For beginners – I repeat one more time – if you add either padding or border to a fixed with element of any kind IE WILL mung it without fail.I am still not sure that this will solve your issue bit it is the first one to eliminate anyway, because it will not be looking spiffy in a number of browsers. HTH.

    Thread Starter petelawley

    (@petelawley)

    Thanks Root, that clears a lot up. I’ll try to fix it in the next couple of days, whenever I have a chance.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘CSS problems with IE’ is closed to new replies.