Willkommen in der Webstatt Zum Webstatt Blog und Stories
Franky Franky am 02.07.06 14:40

Hallo Leute,

hab ein Problem. Und zwar verschieben sich im IE auf http://hp.1.vg/demo-homepage/ die Einträge beim Hover im Menü. Im FF klappt alles.
Woran kann das liegen?
Und docker, erdo oder fish...könnt ihr mir sagen ob die seite auch im opi vernünftig aussieht?

// Die CSS Datei findet ihr auf http://hp.1.vg/designs/springfeeling/style.css
Das Wichtigste ist denke ich folgendes..
div#navi{
margin-left: 10px;
width: 140px;
float: left;
}

ul#navilinks{
list-style: none;
margin: 0 0 0 18px;
padding: 0;
}

ul#navilinks li a{
color: #000;
text-decoration: none;
font: 1.1em/20px verdana, sans-serif;
display: block;
width: 115px;
background: url(nav.gif) no-repeat 0 0;
padding-left: 18px;
margin-bottom: 2px;
}

ul#navilinks li#aktiv a{
background-position: 0 -20px;
font-weight: bold;
}

ul#navilinks li a:hover{
background-position: 0 -20px;
}


Danke :)
Franky

netcup.de Warum gibt es hier Werbung?
milahu milahu am 02.07.06 15:00

Opera rendert wunderbar, im Gegensatz zu Firefox 1.0.8 (s. Anhang).

Hängen die Darstellungsfehler im IE evtl. mit dem verschobenen Hintergrundbild zusammen?
Kann's hier gerade nicht ausprobieren.. :-\

Franky Franky am 02.07.06 15:19

mhh könnte mir nur vorstellen, dass es daran liegt, dass im footer clear:both steht...
wenn wer ne idee hat...bitte melden :)

Franky Franky am 02.07.06 19:09

so hab mich mal selber angestrengt und mal im inet gesucht ^^
es kam dabei raus, dass das wohl ein bekannter bug im ie <= 6 ist. mit dem ie7 soll ja alles besser werden *rolleyes*

/* IE... */
* html ul#navilinks{
height: 1%;
}

* html ul#navilinks li{
height: 20px;
}

* html div#navi{
margin-left: 14px;
}

* html ul#navilinks li a{
width: 133px;
}


aber hab da noch etwas anderes ^^ und zwar werden im ff diese komischen linkpunkte angezeigt, wenn ein link aktiv ist...das würde nicht stören, wenn die nur rund um das <img> element wären, aber die sind aufm ganzen linken bereich neben dem link verteilt...guckts euch aufm anhang an, kb das jetzt noch genauer zu beschreiben x)

a#design{
position: absolute;
left: 171px;
display: block;
width: 136px;
height: 55px;
background: url(design.gif) no-repeat;
text-indent: -1000px;
}

a#provider{
position: absolute;
display: block;
left: 307px;
width: 220px;
height: 55px;
background: url(homepage.gif) no-repeat;
text-indent: -1000px;
}

a#webmaster{
position: absolute;
display: block;
left: 527px;
width: 103px;
height: 55px;
background: url(impressum.gif) no-repeat;
text-indent: -1000px;
}

milahu milahu am 02.07.06 19:33

Dass dieser Rand über die Anzeigefläche hinaus geht kommt von der ja gewollten negativen
Einrückung des Textes. Ließe sich mit JavaScript lösen.. onFocus=blur() :)

Franky Franky am 02.07.06 19:47

mhh würde sich das auch iwie anders lösen lassen?
oder muss ich text-indent unbedingt benutzen?
js möchte ich net wirklich gerne benutzen...

milahu milahu am 02.07.06 20:10

> mhh würde sich das auch iwie anders lösen lassen?
> oder muss ich text-indent unbedingt benutzen?

Ist die momentan einzige browserübergreifende Möglichkeit, Text zuverlässig auszublenden.

> js möchte ich net wirklich gerne benutzen...

..wo doch gerade jetzt JavaScript aktueller denn je ist ;)

Aber mich persönlich stört das gar nicht. Wobei ich natürlich weiß, dass es kaum anders geht.. ;)

Franky Franky am 02.07.06 21:14

Achso ja dann ist auch egal =)
Trotzdem vielen dank für die schnelle Hilfe :)

Jap, die Seite basiert auch auf JS/Ajax...

fish fish am 03.07.06 21:16

top der übergang übrigens.

Creative Commons Lizenzvertrag
Alle Inhalte des Webstatt-Archivs stehen unter einer Creative Commons Namensnennung - Weitergabe unter gleichen Bedingungen 3.0 Unported Lizenz.

Impressum & Kontakt