Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 20.03.2009, 09:50
r4m0n r4m0n ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.09.2008
Beiträge: 4
r4m0n befindet sich auf einem aufstrebenden Ast
Unglücklich Benötige dringend Hilfe mit CSS in Firefox & IE :(

Hallo,

Ich möchte gerne wissen wieso mein CSS Code im Firefox funktioniert und im IE nicht ...
Ich habe schon viel ausprobiert und komme einfach nicht drauf wieso immer eines der beiden Browser spinnen muss. Passe ich zuerst meine Site ans Firefox an spinnt der IE und umgekehrt der Firefox.

Erstmal mein Code:
HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

        <head>

                <title>test</title>

                <meta http-equiv="Content-Type" content="text/html;Charset=utf-8">
                <style type="text/css">
.top

{

        width: 800px;

        padding: 15px;

	margin-left:auto; 

	margin-right:auto; 

        border: 1px solid #ccc;

        background: #fff;

} 



#navSquare 

{

        margin: 0px 0px 0px 0px;

        padding: 30px 0px 22px 200px;

        border-bottom: 1px solid #9FB1BC;

	width: 600px;

}



#navSquare li 

{

        margin: 0px 0px 0px 0px;

        display: inline;

        list-style-type: none;

}



#navSquare a:link, #navSquare a:visited 

{

        font-size: 12px;

        line-height: 14px;

        padding: 0px 0px 6px 0px;

        text-decoration: none;

        color: #708491;

	font-family: Tahoma;

}



#navSquare a:link.active, #navSquare a:visited.active, #navSquare a:hover 

{

        color: #000;
        background: url(images/square.gif) no-repeat bottom center;

}



body 

{

  font-family: verdana, sans-serif;

  font-size: 11px;

  background: #eeeee;

}


</style>

</head>

  <body>

    <div class="top">

      <ul id="navSquare">

	<li style="float:left;width:60px">		<a class="active" href="test1.html">test</a></li>

	<li style="float:left;width:90px">		<a href="test2.html">test</a></li>

	<li style="float:left;width:70px">		<a href="test3.html">test</a></li>

	<li style="float:left;width:80px">		<a href="test4.html">test</a></li>		

	<li style="float:left;width:55px">		<a href="test5.html">test</a></li>

	<li style="float:left;width:80px">		<a href="test6.html">test</a></li>

	<li style="float:right;width:27px">	<a href="test7.html">test</a></li>

	<li style="float:right;width:40px">	<a href="test8.html">test</a></li>

      </ul>

    </div>

</body>

</html>
Welcher Teil meines Codes ist nicht IE kompatibel? Beim hovern über einen Link erscheint im Firefox ein kleiner Balken unter dem Link der im IE nicht angezeigt wird. Auch sind die Links im IE ingesamt was nach oben verschoben!?? Kann mir einer sagen wie ich den IE dazu bekomme diesen Code exakt wie im Firefox anzuzeigen?

info:
der w3c website validator & css validator zeigen keine fehler an!
firefox ist in der neuesten version und der IE in der version 7

Bin Euch für Antworten wirklich sehr dankbar!

mfg R.
Mit Zitat antworten
Sponsored Links