[Glorfindal]

Okay I am working on a navigation bar for my website and having several troubles with different browsers and spacing aswell positioning. Here is my code:

<table height="60%" border="0"><tr><td valign="top" width="9%"><!--[if IE]>
<style type="text/css">
div.style {
margin-left: 2px;
margin-top: 4px
</style>
<![endif]-->
<![if !IE]>
<style type="text/css">
div.style {
margin-left: -8px;
margin-top: 2px
}
a.style {
margin-left: -8px;
margin-top: 2px
}
</style>
<![endif]>
<div class="style counter" align="left" title="Since 6/6/2010">
301 Hits</div>
<p></p><p>
<a href="http://www.dragonkwest.net/index.php" class="HomeLink style"></a>
<a href="http://www.dragonkwest.net/forum/" class="ForumLink style"></a>
<a href="http://www.dragonkwest.net/pictures.php?ID=1" class="PictureLink style"></a>
<a href="http://www.dragonkwest.net/wiki/" class="WikiLink style"></a>

<a href="http://www.dragonkwest.net/aboutme.php" class="aboutmelink style"></a></p><p>
<a href="http://www.dragonkwest.net/rss.xml" style="margin-top: 40px;"><img border="0" src="http://www.w3schools.com/rss/rss.gif"></img></a>
</p>
</td>...

That's not all the code but I think it is the one causing it. Here is a screenshot.
Mozilla Firefox (how it should look)


Internet Explorer (Incorrect)

[drhowarddrfine]

When looking at IE and other browsers, always remember that it will be IE that is in the wrong.

Now, onto the code. Without a link or the complete markup, it's going to be just guesswork for the solution. Hint #1: Never use tables for layout. They're difficult to debug and inflexible at best.

This post has been edited by drhowarddrfine: 30 August 2010 - 03:45 PM

[PhunkRabbit]

Ensure you are using a CSS reset, it makes cross browser problems alot easier to fix for the start.

* { margin:0; padding:0; }

This is a bad example but will show you what I mean if you paste it into your CSS. Here is a good example of a nice CSS reset: http://meyerweb.com/...reset-reloaded/

[drhowarddrfine]

And there are those who disagree with CSS resets. My opinion is to set all elements to what you want on your own rather than a blanket zero'ing of everything. Chances are you'll do that anyway and the reset serves no purpose but to take up space.

[PhunkRabbit]

drhowarddrfine, on 31 August 2010 - 09:41 AM, said:

And there are those who disagree with CSS resets. My opinion is to set all elements to what you want on your own rather than a blanket zero'ing of everything. Chances are you'll do that anyway and the reset serves no purpose but to take up space.

I think it is safe to say we both have a very different outlook on CSS both in style and use.

If you are concerned with the ammount of code you are putting in your CSS file thats just a further argument to using float over position (since your having to set more rules into a positioned element than a float thus creating a bigger file, most of the time), im not going to get into it all again in someone elses thread but may make one to see the general opinion of people on the board.

[drhowarddrfine]

PhunkRabbit, on 31 August 2010 - 03:49 AM, said:

im not going to get into it all again in someone elses thread but may make one to see the general opinion of people on the board.

Been there. Done that.

[PhunkRabbit]

Quote

Published April 17, 2008

I dont know about you but I have progressed since then, opinions change.