catfish Posted July 8, 2009 Report Share Posted July 8, 2009 I thought I had my site almost done and then ran into an issue I believe when I checked it in newly installed IE 8. My navigation is supposed to be snug under the header div and now there is a space. I had played with the h1 tag the same day and now I don't know what to do. Please have a look and give some advice. It looks ok in IE 7, FF etc. Thanks http://www.catfishwebcreations.com/DrSmith/staff-members.html Quote Link to comment Share on other sites More sharing options...
virtual Posted July 10, 2009 Report Share Posted July 10, 2009 (edited) Read this articles http://blogs.msdn.com/ie/archive/2008/06/10/introducing-ie-emulateie7.aspx Not only do we have to contend with IE6 and it's particular can of worms, IE7 was an improvement, but didn't quite get there, and now we have IE8 that does something totally different. Great job Microsoft, were you leaders of the industry a while ago....?? Edited July 10, 2009 by virtual Quote Link to comment Share on other sites More sharing options...
Wickham Posted July 11, 2009 Report Share Posted July 11, 2009 (edited) As a last resort, make all viewers view the page as IE7 by putting this code just after the tag (not lower down the head tag where it may not work):- Close with /> instead of > if using a XHTML doctype. Edit: I didn't realise that the link Virtual gave is to the meta link I gave above. I've managed to get rid of the gap in IE8 by editing only one style in the navigation_grey_burgundy.css menu file:- #nav {position:relative; z-index:100; margin:0;/*0 0 10px 0;*/ border-top:0px solid #000;} where it had a margin-bottom of 10px before. I'm not entirely sure why deleting a bottom margin should affect the space at the top, but it does. I assume that the overall height became too much for the space, so IE8 made more height and placed it at the bottom of the space! #nav-strip in the other css file is only 26px high which isn't enough for the menu and a 10px bottom margin. Edited July 11, 2009 by Wickham Quote Link to comment Share on other sites More sharing options...
catfish Posted July 13, 2009 Author Report Share Posted July 13, 2009 Thankyou for your replies, I just checked, will make the adjustment and see if that's it. Can you tell me what the slashes and stars (?) are for like this margin:0;/*0 0 10px 0;*/ Quote Link to comment Share on other sites More sharing options...
PicnicTutorials Posted July 13, 2009 Report Share Posted July 13, 2009 They're css comments for clarity. Quote Link to comment Share on other sites More sharing options...
Wickham Posted July 14, 2009 Report Share Posted July 14, 2009 As Eric says, the /* and */ are css comments; the code inside the /* and */ is ignored by browsers. I usually leave the original code when I edit code so that the person who asked the question can see what I've edited. Use as comments in HTML markup but /* and */ in CSS styles. I tested my edit in IE8. Quote Link to comment Share on other sites More sharing options...
BeeDev Posted July 14, 2009 Report Share Posted July 14, 2009 Your div#nav-strip is overlapping div.column on that "Call (250) 748-0301" bit of text. I'm guessing your menu is being pushed down by the Margin of Call (250) 748-0301 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.