Hat dann soweit alles nach FAQ 15 super geklappt, aber ich musste noch
PHP-Code:
ul{list-style-type:none;}
für das erste Element einsetzen, da ich ansonsten einen Listenpunkt hatte und
PHP-Code:
a {text-decoration:none;}
ergänzen, um keine "-" zwischen den Bildern zu haben.
Hab ich das was falsch gemacht?
PHP-Code:
#navi{margin:0 auto;}
#navi li{float:left;}
#navi #link1{width:82px;}
#navi #link2{width:77px;}
#navi #link3{width:108px;}
#navi a,#navi strong{display:block;height:50px;width:100%;position:relative;overflow:hidden;}
#navi span{position:absolute;width:100%;height:50px;top:0;left:0;background:url(navi.gif);}
#navi #link1 a span{background-position:0 0;}
#navi #link2 a span{background-position:-82px 0;}
#navi #link3 a span{background-position:-159px 0;}
#navi #link1 a:hover span,#navi #link1 strong span{background-position:0 -50px;}
#navi #link2 a:hover span,#navi #link2 strong span{background-position:-82px -50px;}
#navi #link3 a:hover span,#navi #link3 strong span{background-position:-159px -50px;}
Und noch etwas: Folgender Code
PHP-Code:
#logo{width:155px;float:left;}
#logo a, #logo strong{display:block;height:168px;width:100%;position:relative;overflow:hidden;}
#logo span{position:absolute;width:100%;height:168px;top:0;left:0;background:url(logo.gif);}
führt im Browser Chrome dazu, dass das Logo repeated wird und alle BG's rechts daneben überdeckt, wenn auf der index-Seite <strong> anstatt <a href> für das Logo verwendet wird.
PHP-Code:
<div id="logo"><strong>Logo<span> </span></strong></div>
P.S. Wenn man zwischen den <span/> noch ein non-breaking space ( ) einbaut, ist es sogar nach Tidy und W3C valide.
Greetz