Unwanted space in IE?
I have a navigation bar that goes something like this:
<div id="nav">
LINK 1
LINK 2
LINK 3
</div>
<div id="shadow">
IMG OF SHADOW...5PX high
</div>
This displays as expected in opera and firefox, but there is space between the nav and shadow in IE.
If i move everything in the NAV div to a single line, it works. If I unindent the links it doesn't.. it seems that I need to have the entire div on one line to overcome this.. am I missing something!?
SonicMailer Pro - Professional mailing list manager & award-winning email marketing software
Download a FREE 30-day trial today!
Use coupon savemoreon4 and save 10%!
Renegade posted this at 19:56 — 15th March 2006.
He has: 3,022 posts
Joined: Oct 2002
It's because IE reads the extra space that you have put in for tabbing and making things easier to read. This is why putting things on a single line works. However, I have seen one or two people code like the following to solve this IE thing:
<div id="nav"
><ul
><li
>Link 1</li
></ul
></div>
Triexa.com posted this at 19:59 — 15th March 2006.
They have: 173 posts
Joined: Feb 2005
Yikes that's ugly!
Is there anything else I can do, allowing for the indents?
The other solution I thought of it so "build" it through PHP... then each echo statement wouldn't print out these tab issues...
SonicMailer Pro - Professional mailing list manager & award-winning email marketing software
Download a FREE 30-day trial today!
Use coupon savemoreon4 and save 10%!
Triexa.com posted this at 19:58 — 15th March 2006.
They have: 173 posts
Joined: Feb 2005
Here is a test page:
http://www.triexa.com/temp/test.php
Its JUST the menu+shadow..
Roo posted this at 20:34 — 15th March 2006.
She has: 840 posts
Joined: Apr 1999
Yes IE had quirks when things are not on the same line for example:
If you have
Contnent
IE will leave a gap.
If you do
Content
The gap would close.
Roo
Triexa.com posted this at 21:22 — 15th March 2006.
They have: 173 posts
Joined: Feb 2005
So what about a solution...? Anyone?
Roo posted this at 01:56 — 16th March 2006.
She has: 840 posts
Joined: Apr 1999
How is this supposed to display? You have it posted like it's supposed to be a list, but there isn't the list tags?
This would display the links horizontally...
LINK 1 LINK 2 LINK 3
IMG OF SHADOW...5PX high
'Course we don't know how this is supposed to display, and we don't know what is in the css for those id's.
Roo
Triexa.com posted this at 03:51 — 16th March 2006.
They have: 173 posts
Joined: Feb 2005
I posted the page (http://www.triexa.com/temp/test.php) which shows the code, and how the shadow is pushed down in IE... ?
SonicMailer Pro - Professional mailing list manager & award-winning email marketing software
Download a FREE 30-day trial today!
Use coupon savemoreon4 and save 10%!
Renegade posted this at 06:04 — 16th March 2006.
He has: 3,022 posts
Joined: Oct 2002
Well, I just had a quick try at it and this is what I came up with:
http://chengeu.orcon.net.nz/temp/twf/
Works in IE and FF (most probably Opera too) is validates as XHTML strict. CSS is also valid. Why don't you give it a try and see how it works for you. Feel free to change the text links to images, it should work the same.
Good luck
Triexa.com posted this at 15:44 — 16th March 2006.
They have: 173 posts
Joined: Feb 2005
Seeing as how I am just starting the layout... I wonder if I should go for XHTML... or 4.01 transitional
Renegade posted this at 17:41 — 16th March 2006.
He has: 3,022 posts
Joined: Oct 2002
Well, I think if you're just starting out, you should go for XHTML Transitional. That way, it will be easier for you to move to strict. If you're serious about the web, you're going to learn XHTML. Just miss an extra step and go straight to it
Triexa.com posted this at 19:15 — 16th March 2006.
They have: 173 posts
Joined: Feb 2005
What is "so" different about XHTML though? Like really the only thing I truly notice is closing of non-closing tags.. like BR. And fewer attributes, more configured through CSS... what else is there to it? 'Cause that's easy, haha!
SonicMailer Pro - Professional mailing list manager & award-winning email marketing software
Download a FREE 30-day trial today!
Use coupon savemoreon4 and save 10%!
Busy posted this at 20:01 — 16th March 2006.
He has: 6,151 posts
Joined: May 2001
Thats about it, and all tags lowercase.
XHTML is just a cleaned up version of HTML really, with a side serving of CSS to spruce things up
Roo posted this at 20:28 — 16th March 2006.
She has: 840 posts
Joined: Apr 1999
Ah but the best thing about xhtml is that it won't let you screw up! Go ahead and forget one measly little quote mark and watch a whole page get tossed into a hissy fit!
If you've got an an issue, you know that you've left someting out or forgotten to put something in.
Roo
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.