list-menü cssformatierung unter ie anders als mozilla

taz

Legend

Registered: Apr 2000
Location: ärgsten Kaff
Posts: 2233

25.02.2004 - 22:21

ich hab mir von accessify das tool list-o-matic angesehen, welches ein list-menü als site-navigation generiert. soweit so gut.

unter mozilla sieht das ganze auch sehr gut aus einfaches menü mit hover effekt und 1 dünne graue linie zw den menüpunkten. unter ie6 ist eine unschöne ca 5mm hohe graue leiste zw jedem der menüpunkte. ich hab mir den code mehrmals durchgelesen und herumprobiert, aber den effekt konnte ich nicht wegkriegen

CODE:

<!doctype html public "-//W3C//DTD HTML 4.0 //EN">
<html>
<head>
<title></title>
<meta name="author" content="muh">
<meta name="generator" content="Ulli Meybohms HTML EDITOR">

<style type="text/css">

</style>

</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">

<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>

</body>
</html>

Rektal

Here to stay

Registered: Dec 2002
Location: Inside
Posts: 4452

26.02.2004 - 00:13

Der Fehler liegt .. in den "whitespaces" zwischen den </li> und <li> tags .. jaja .. der liebe IE.

Mach aus dem code folgendes:

Code:

<ul><li><a href="">Item one</a></li
><li><a href="">Item two</a></li
>....

Weiss, schaut *******e im HTML code aus und readability ist (fast) weg, obwohls mit der Methode eh' noch recht gut geht. Kannst natuerlich auch alles in einer wurscht schreiben, aber so wie von mir angegeben hauts eh hin.

taz

Legend

Registered: Apr 2000
Location: ärgsten Kaff
Posts: 2233

26.02.2004 - 15:20

danke rektal !

auf sowas muss man ja erstmal kommen :rolleyes:

Rektal

Here to stay

Registered: Dec 2002
Location: Inside
Posts: 4452

26.02.2004 - 17:04

Jep ... hat mich auch Zeit gekostet das rauszufinden ... ;-P

Btw, solved oder?

Bearbeitet von Rektal am 26.02.2004, 17:14

taz

Legend

Registered: Apr 2000
Location: ärgsten Kaff
Posts: 2233

26.02.2004 - 22:29

yeah solved ( aber das hindert nicht daran, dass dauernd neue troubles kommen ;(

taz

Legend

Registered: Apr 2000
Location: ärgsten Kaff
Posts: 2233

26.02.2004 - 23:32

Und schon hat sich wieder ein solches ie-problem ergeben
meine derzeitige dummy-site:
http://tmp.gallien.org/vcf/index.html

css:http://tmp.gallien.org/vcf/css/stil.css

unter ie6 und mozilla sieht es so aus wie es sein soll
ein rahmen darin das bild darunter das kleine rechtsbündige menü und darunter wieder links die navigation und rechts der content

bei ie5 jedoch schiebt sich die navigation und der content hinauf und überschneiden sich somit voll mit dem rechtsbündigen menüe

als workaround würd mir nur einfallen die navigation und den content absolut zu positionieren (top: 80 px oder so). eine echte lösung wär mir jedoch lieber

Rektal

Here to stay

Registered: Dec 2002
Location: Inside
Posts: 4452

26.02.2004 - 23:44

Da du die Liste floatest (ich frag mich ob hier nicht ein text-align: right; irgendwie funktionieren wuerde), versuch mal "clear: right;" bei #menu .

taz

Legend

Registered: Apr 2000
Location: ärgsten Kaff
Posts: 2233

28.02.2004 - 08:28

thx und wieder 100 punkte an Rektal *hut ab*

eine frage hätte ich noch

ich denke es geht nicht zumindest war beim googlen und selfhtml nix zum finden:

ist es möglich margin und padding eine farbe zuzuweisen ?

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

28.02.2004 - 11:19

Zitat von taz
thx und wieder 100 punkte an Rektal *hut ab*

eine frage hätte ich noch
ich denke es geht nicht zumindest war beim googlen und selfhtml nix zum finden:

ist es möglich margin und padding eine farbe zuzuweisen ?

nein, da das ja nur ein abstand is.
Natürlich kannst du sowas mit verschachtelten elementen "simulieren"..

Rektal

Here to stay

Registered: Dec 2002
Location: Inside
Posts: 4452

28.02.2004 - 13:26

Man, watchout. Jetzt haette ich fast 3 mal in Serie 100 Punkte kassieren koennen. Du nichtsgoenner :-P

Wobei man sagen muss, margin und padding sind ja transparent. Mit dem angesprochenen Verschachteln kann man auch interessante Dinge machen, wobei padding-farbe im prinzip background-color des jeweiligen Elementes ist.

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

28.02.2004 - 13:43

Zitat von Rektal
Man, watchout. Jetzt haette ich fast 3 mal in Serie 100 Punkte kassieren koennen. Du nichtsgoenner :-P

das konnte ich ja nicht zulassen

taz

Legend

Registered: Apr 2000
Location: ärgsten Kaff
Posts: 2233

28.02.2004 - 21:02

da streiten sich 2 0wner wer einen armen schlucker zuerst fertig machen darf

thx sowohl background-color, alsauch verschachtelte divs werden mir helfen

taz Legend Registered: Apr 2000 Location: ärgsten Kaff Posts: 2233	25.02.2004 - 22:21 ich hab mir von accessify das tool list-o-matic angesehen, welches ein list-menü als site-navigation generiert. soweit so gut. unter mozilla sieht das ganze auch sehr gut aus einfaches menü mit hover effekt und 1 dünne graue linie zw den menüpunkten. unter ie6 ist eine unschöne ca 5mm hohe graue leiste zw jedem der menüpunkte. ich hab mir den code mehrmals durchgelesen und herumprobiert, aber den effekt konnte ich nicht wegkriegen CODE: <!doctype html public "-//W3C//DTD HTML 4.0 //EN"> <html> <head> <title></title> <meta name="author" content="muh"> <meta name="generator" content="Ulli Meybohms HTML EDITOR"> <style type="text/css"> <!-- #navlist { padding: 0 1px 1px; margin-left: 0; font: bold 12px Verdana, sans-serif; background: gray; width: 13em; } #navlist li { list-style: none; margin: 0; border-top: 1px solid gray; text-align: left; } #navlist li a { display: block; padding: 3px 10px 3px 10px; border-left: 1em solid #AAB; background: #CCD; text-decoration: none; } #navlist li a:link { color: #448; } #navlist li a:visited { color: #667; } #navlist li a:hover { border-color: #FE3; color: #FFF; background: #332; } --> </style> </head> <body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000"> <div id="navcontainer"> <ul id="navlist"> <li id="active"><a href="#" id="current">Item one</a></li> <li><a href="#">Item two</a></li> <li><a href="#">Item three</a></li> <li><a href="#">Item four</a></li> <li><a href="#">Item five</a></li> </ul> </div> </body> </html>
Rektal Here to stay Registered: Dec 2002 Location: Inside Posts: 4452	26.02.2004 - 00:13 Der Fehler liegt .. in den "whitespaces" zwischen den </li> und <li> tags .. jaja .. der liebe IE. Mach aus dem code folgendes: Code: `<ul><li><a href="">Item one</a></li ><li><a href="">Item two</a></li >....` Weiss, schaut *******e im HTML code aus und readability ist (fast) weg, obwohls mit der Methode eh' noch recht gut geht. Kannst natuerlich auch alles in einer wurscht schreiben, aber so wie von mir angegeben hauts eh hin.
taz Legend Registered: Apr 2000 Location: ärgsten Kaff Posts: 2233	26.02.2004 - 15:20 danke rektal ! auf sowas muss man ja erstmal kommen
Rektal Here to stay Registered: Dec 2002 Location: Inside Posts: 4452	26.02.2004 - 17:04 Jep ... hat mich auch Zeit gekostet das rauszufinden ... ;-P Btw, solved oder? Bearbeitet von Rektal am 26.02.2004, 17:14
taz Legend Registered: Apr 2000 Location: ärgsten Kaff Posts: 2233	26.02.2004 - 22:29 yeah solved ( aber das hindert nicht daran, dass dauernd neue troubles kommen ;(
taz Legend Registered: Apr 2000 Location: ärgsten Kaff Posts: 2233	26.02.2004 - 23:32 Und schon hat sich wieder ein solches ie-problem ergeben meine derzeitige dummy-site: http://tmp.gallien.org/vcf/index.html css:http://tmp.gallien.org/vcf/css/stil.css unter ie6 und mozilla sieht es so aus wie es sein soll ein rahmen darin das bild darunter das kleine rechtsbündige menü und darunter wieder links die navigation und rechts der content bei ie5 jedoch schiebt sich die navigation und der content hinauf und überschneiden sich somit voll mit dem rechtsbündigen menüe als workaround würd mir nur einfallen die navigation und den content absolut zu positionieren (top: 80 px oder so). eine echte lösung wär mir jedoch lieber
Rektal Here to stay Registered: Dec 2002 Location: Inside Posts: 4452	26.02.2004 - 23:44 Da du die Liste floatest (ich frag mich ob hier nicht ein text-align: right; irgendwie funktionieren wuerde), versuch mal "clear: right;" bei #menu .
taz Legend Registered: Apr 2000 Location: ärgsten Kaff Posts: 2233	28.02.2004 - 08:28 thx und wieder 100 punkte an Rektal hut ab eine frage hätte ich noch ich denke es geht nicht zumindest war beim googlen und selfhtml nix zum finden: ist es möglich margin und padding eine farbe zuzuweisen ?
watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	28.02.2004 - 11:19 Zitat von taz thx und wieder 100 punkte an Rektal hut ab eine frage hätte ich noch ich denke es geht nicht zumindest war beim googlen und selfhtml nix zum finden: ist es möglich margin und padding eine farbe zuzuweisen ? nein, da das ja nur ein abstand is. Natürlich kannst du sowas mit verschachtelten elementen "simulieren"..
Rektal Here to stay Registered: Dec 2002 Location: Inside Posts: 4452	28.02.2004 - 13:26 Man, watchout. Jetzt haette ich fast 3 mal in Serie 100 Punkte kassieren koennen. Du nichtsgoenner :-P Wobei man sagen muss, margin und padding sind ja transparent. Mit dem angesprochenen Verschachteln kann man auch interessante Dinge machen, wobei padding-farbe im prinzip background-color des jeweiligen Elementes ist.
watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	28.02.2004 - 13:43 Zitat von Rektal Man, watchout. Jetzt haette ich fast 3 mal in Serie 100 Punkte kassieren koennen. Du nichtsgoenner :-P das konnte ich ja nicht zulassen
taz Legend Registered: Apr 2000 Location: ärgsten Kaff Posts: 2233	28.02.2004 - 21:02 da streiten sich 2 0wner wer einen armen schlucker zuerst fertig machen darf thx sowohl background-color, alsauch verschachtelte divs werden mir helfen

list-menü cssformatierung unter ie anders als mozilla

Forum Index > Software > Coding Stuff

taz

Rektal

taz

Rektal

taz

taz

Rektal

taz

watchout

Rektal

watchout

taz