Tabbed code misbehaving in IE.

  • Zonezero5
  • Novice
  • Novice
  • Zonezero5
  • Posts: 25

Post 3+ Months Ago

I like tabbing my code so it's easier for me to read and go threw etc. but a lot of the time this causes problems in the way the site is displayed in IE.

For example:

Code: [ Select ]
<div id="nav">
        <img src="/images/nav_top.png" width="1001" height="3" alt="nav_top" /><ul id="links"><li><a href="/">Home</a></li><li><a href="/">About Us</a></li><li><a href="/">Policies</a></li><li><a href="/">Apply</a></li><li><a href="/">Forums</a></li><li><a href="/">DKP</a></li><li><a href="/">Videos</a></li></ul>
</div>
  1. <div id="nav">
  2.         <img src="/images/nav_top.png" width="1001" height="3" alt="nav_top" /><ul id="links"><li><a href="/">Home</a></li><li><a href="/">About Us</a></li><li><a href="/">Policies</a></li><li><a href="/">Apply</a></li><li><a href="/">Forums</a></li><li><a href="/">DKP</a></li><li><a href="/">Videos</a></li></ul>
  3. </div>


The above will display as intended. However the below:

Code: [ Select ]
<div id="nav">
    <img src="/images/nav_top.png" width="1001" height="3" alt="nav_top" />
   
    <ul id="links">
        <li><a href="/">Home</a></li>
        <li><a href="/">About Us</a></li>
        <li><a href="/">Policies</a></li>
        <li><a href="/">Apply</a></li>
        <li><a href="/">Forums</a></li>
        <li><a href="/">DKP</a></li>
        <li><a href="/">Videos</a></li>
    </ul>
</div>
  1. <div id="nav">
  2.     <img src="/images/nav_top.png" width="1001" height="3" alt="nav_top" />
  3.    
  4.     <ul id="links">
  5.         <li><a href="/">Home</a></li>
  6.         <li><a href="/">About Us</a></li>
  7.         <li><a href="/">Policies</a></li>
  8.         <li><a href="/">Apply</a></li>
  9.         <li><a href="/">Forums</a></li>
  10.         <li><a href="/">DKP</a></li>
  11.         <li><a href="/">Videos</a></li>
  12.     </ul>
  13. </div>


This will put a nice big space between the image and inline list.

Is it something specific to my code? Or is there some other coding practice or something I can do so I can have my code tabbed and still display properly in IE?

If it's needed I can link to the site in question above, but I generally find tabbing like the above to cause problems consistently in IE, not specific to this case.


Thanks for any help / advice.
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • graphixboy
  • Control + Z
  • Mastermind
  • User avatar
  • Posts: 1828
  • Loc: In the Great White North

Post 3+ Months Ago

Just remove the space after the image. IE has a hard time if the next tag doesn't go up against the image close tag. The rest of your white space should be fine.
  • Zonezero5
  • Novice
  • Novice
  • Zonezero5
  • Posts: 25

Post 3+ Months Ago

Did you mean?:

Code: [ Select ]
<div id="nav">
    <img src="/images/nav_top.png" width="1001" height="3" alt="nav_top" /><ul id="links">
        <li><a href="/">Home</a></li>
        <li><a href="/">About Us</a></li>
        <li><a href="/">Policies</a></li>
        <li><a href="/">Apply</a></li>
        <li><a href="/">Forums</a></li>
        <li><a href="/">DKP</a></li>
        <li><a href="/">Videos</a></li>
    </ul>
</div>
  1. <div id="nav">
  2.     <img src="/images/nav_top.png" width="1001" height="3" alt="nav_top" /><ul id="links">
  3.         <li><a href="/">Home</a></li>
  4.         <li><a href="/">About Us</a></li>
  5.         <li><a href="/">Policies</a></li>
  6.         <li><a href="/">Apply</a></li>
  7.         <li><a href="/">Forums</a></li>
  8.         <li><a href="/">DKP</a></li>
  9.         <li><a href="/">Videos</a></li>
  10.     </ul>
  11. </div>


That's what I had to do to make it render properly. Given it's better than what I originally had to do is there anything else different that can be done that's better?

Thanks again.

Post Information

  • Total Posts in this topic: 3 posts
  • Users browsing this forum: No registered users and 81 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.