nicht angemeldet
Formatierung von Containern unter IE nicht möglich !?
Hallo,
ich hoffe ihr könnt mir helfen. Ich weiß, dass der IE an einigen Stellen Probleme macht, doch hoffentlich weiß einer von euch, wie ich das ganze umgehen kann oder korregieren kann.
Ich möchte gerne mittels CSS einige "Buttons" in unterschiedlicher Farbe erstellen.
Dabei werden allen Links mittels id="menu" umrahmt.
Unter id="menux" sollen dann nur die jeweiligen Farbenfüllungen angegeben werden. Somit sollte die in "menu" beschriebene Formatierung an die "menux" "vererbt" verwerden.
Dazu fand ich irgendwo im Netz den ">"Operator. In Firefox funktioniert das ganze, lediglich der IE macht Probleme.
Dafür funkioniert die Breitenangabe "width=150px" im IE, der Firefox hingegen umrandet nur die maximale Wortlänge.
Was soll ich tun?
Alex
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div id="menu">
<a id="menu1" href="test.html">Test1</a>
<a id="menu2" href="test.html">Test2</a>
<a id="menu3" href="test.html">Test3</a>
<a id="menu4" href="test.html">Test4</a>
</div>
</body>
</html>
-------------------------
#menu a
{
display:inline;
margin-bottom:5px;
text-align:center;
width:150px;
border-style:solid;
border-width:1px;
padding:2px;
text-decoration:none;
}
#menu a:link { color:black; background-color:transparent; }
#menu a:visited { color:black; background-color:transparent; }
#menu a:hover { color:grey; background-color:transparent; }
#menu a:active { color:red; background-color:transparent; }
#menu>#menu1
{
background-color: red;
}
-
Hallo Alex.
ich hoffe ihr könnt mir helfen.
Ich bin überzeugt, dass wir das können.
Ich weiß, dass der IE an einigen Stellen Probleme macht, doch hoffentlich weiß einer von euch, wie ich das ganze umgehen kann oder korregieren kann.
Mal sehen.
Ich möchte gerne mittels CSS einige "Buttons" in unterschiedlicher Farbe erstellen.
Das deutet auf eine Navigation hin. Korrekt?
Dabei werden allen Links mittels id="menu" umrahmt.
Das bezweifle ich. Ich schätze eher, dass du auf diese Element mittels des jeweiligen id-Wertes zugreifst und sie somit formatierst.
Dazu fand ich irgendwo im Netz den ">"Operator. In Firefox funktioniert das ganze, lediglich der IE macht Probleme.
Ja, er beherrscht diesen Selektor (bis V7) nicht.
Dafür funkioniert die Breitenangabe "width=150px" im IE, der Firefox hingegen umrandet nur die maximale Wortlänge.
Das deutet auf eine falschlicherweise umgesetzte Breitenangabe für ein Inlineelement hin.
Bitte verlasse den Quirksmodus.Was soll ich tun?
<html>
Gib bitte einen DOCTYPE an.
<head>
Bitte schreibe gültiges HTML.
(Zu einem gültigen HTML-Dokument gehört *zwingend* ein Titel)<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div id="menu">
<a id="menu1" href="test.html">Test1</a>
<a id="menu2" href="test.html">Test2</a>
<a id="menu3" href="test.html">Test3</a>
<a id="menu4" href="test.html">Test4</a>
</div>Warum nutzt du hierfür keine Liste?
#menu a
{
display:inline;
margin-bottom:5px;
text-align:center;
width:150px;
border-style:solid;
border-width:1px;
padding:2px;
text-decoration:none;
}Du formatierst die a-Elemente als inline, obwohl sie dies durch ihre Eigenschaft als Inlineelemente bereits sind.
#menu a:link { color:black; background-color:transparent; }
#menu a:visited { color:black; background-color:transparent; }
#menu a:hover { color:grey; background-color:transparent; }
#menu a:active { color:red; background-color:transparent; }Diese Hintergrundangabe ist recht sinnfrei.
#menu>#menu1
{
background-color: red;
}Welchen Zweck soll die Hervorhebung des ersten Navigationspunktes haben?
Einen schönen Dienstag noch.
Gruß, Ashura
--
Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
30 Days to becoming an Opera8 Lover -- Keyboard Shortcuts
Meine Browser: Opera 8.50 | Firefox 1.0.7 | Lynx 2.8.5 | Konqueror 3.3.2 | Netscape 4.7 | IE 6.0
-
Wow, das ging ja wirklich schnell!
DOCTYPE und Titel habe ich übersichtshalber weggelassen. Sorry!Das mit dem ">"-Operator ist gut zu wissen. Danke.
Eine Liste hätte man auch nehmen können... wollte es aber so versuchen. Ist die Liste sinnvoller?
Ich wollte gerne alle Navigationselemente mit Farben belegen. Zur Demonstration habe ich aber hier nur eines dargestellt.
Was nun? Wie könnte ich meine Vorstellungen am besten umsetzten. Bin für jeden Tip dankbar.
Gruß, Alex
-
Hallo Alex.
DOCTYPE und Titel habe ich übersichtshalber weggelassen. Sorry!
Die Übersicht ist eher gewahrt, wenn das HTML-Dokument mehr oder weniger vollständig ist.
Eine Liste hätte man auch nehmen können... wollte es aber so versuchen. Ist die Liste sinnvoller?
Ja, absolut.
Denn sie drückt genau das aus, was anhand deines Inhaltes sichtbar ist: eine Auflistung von Navigationspunkten.Ich wollte gerne alle Navigationselemente mit Farben belegen. Zur Demonstration habe ich aber hier nur eines dargestellt.
Wenn du alle belegen möchtest, warum tust du dies dann nicht gleich in der a#menuX-Regel?
Was nun? Wie könnte ich meine Vorstellungen am besten umsetzten. Bin für jeden Tip dankbar.
Sollen nun alle Navigationspunkte gleich aussehen, soll einer hervor gehoben werden, oder ..?
Für Ersteres müsstest du nicht einmal jedem Navigationspunkt eine eigene ID verpassen. Eine ID / Klasse für das ul / ol-Element und du kannst darüber recht eindeutig die Kindelemente auswählen.
Für Zweiteres müsstest du lediglich dem hervorzuhebenden Navigationspunkt eine ID verpassen, welche du dann gesondert formatierst.
Einen schönen Dienstag noch.
Gruß, Ashura
--
Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
30 Days to becoming an Opera8 Lover -- Keyboard Shortcuts
Meine Browser: Opera 8.50 | Firefox 1.0.7 | Lynx 2.8.5 | Konqueror 3.3.2 | Netscape 4.7 | IE 6.0
-
Guten Abend,
die Navigatiomselemente sollen alle eine ANDERE Farbe haben.
Ich werde mal noch ein bißchen rumprobieren.Wenn es mal wieder nicht funktionieren sollte, dann melde ich mich noch einmal ;-)
Danke,
Alex-
Hallo Alex.
die Navigatiomselemente sollen alle eine ANDERE Farbe haben.
Dann vergebe bitte sinnvollere IDs.
Ein „menuX“ ist nicht sonderlich aussagekräftig.
Halte dir immer vor Augen, dass du HTML-Dokumente vorrangig für Menschen schreibst und dir somit später auch Arbeit ersparst, wenn du den Code modifzieren möchtest / musst.Ich werde mal noch ein bißchen rumprobieren.
Tu das.
Für deine Lösung wirst du in der Tat nicht um separate IDs umhin kommen.
Eine Alternative wäre der „+“-Selektor, aber du kannst dir sicher denken, wer diesen wieder nicht unterstützt...Einen schönen Dienstag noch.
Gruß, Ashura
--
Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
30 Days to becoming an Opera8 Lover -- Keyboard Shortcuts
Meine Browser: Opera 8.50 | Firefox 1.0.7 | Lynx 2.8.5 | Konqueror 3.3.2 | Netscape 4.7 | IE 6.0
-
Hallo Ashura,
erst mal ein "Danke schön" an dieser Stelle.
Hab aber schnell noch eine Frage: Warum funktioniert das "width"-Attribut mit Firefox nicht?
Hier macht der IE keine Probleme. Wenn das CSS noch so viele Probleme macht, dann sollte man eigentlich darauf verzichten :-)Ich sehe die Vorteile von CSS, doch wenn jeder Browser das macht, was er will und es keinen richtigen Standard gibt, dann ist das schon eine unsichere Sache... Naja, vielleicht sollte der IE sich lediglich an den vorhanden Standards halten. Leider hat der IE noch einen großen Marktanteil, sodass man seine Defizite leider berücksichtigen muss.
Siehe dazu: http://barrierefrei.e-workers.de/workshops/ie-fun/index.html
Alex
-
Hallo Alex.
Hab aber schnell noch eine Frage: Warum funktioniert das "width"-Attribut mit Firefox nicht?
Es funktioniert wunderbar.
Aber meinst du nicht eigentlich die width-Eigenschaft? Die wirkt nur auf replaced-inline (Elemente, die gegen ihr Ziel ersetzt werden, img zum Beispiel)- und Blockelemente.Hier macht der IE keine Probleme. Wenn das CSS noch so viele Probleme macht, dann sollte man eigentlich darauf verzichten :-)
Wie gesagt musst du nur den IE 6.0 in den Standard-Compliance-Modus schicken, damit auch er die Breitenangabe für Inlineelemente ignoriert.
Ich sehe die Vorteile von CSS, doch wenn jeder Browser das macht, was er will und es keinen richtigen Standard gibt, dann ist das schon eine unsichere Sache...
Es gibt ja Standards. Und moderne Browser (Gecko-basiert, Opera, Konqueror, Safari, ...) halten sich ja daran. Nur der IE tanzt neben anderen veralteten Browsern aus der Reihe.
Naja, vielleicht sollte der IE sich lediglich an den vorhanden Standards halten.
Daran arbeiten die IE-Entwickler momentan.
Leider hat der IE noch einen großen Marktanteil, sodass man seine Defizite leider berücksichtigen muss.
Richtig. Leider.
Einen schönen Dienstag noch.
Gruß, Ashura
--
Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
30 Days to becoming an Opera8 Lover -- Keyboard Shortcuts
Meine Browser: Opera 8.50 | Firefox 1.0.7 | Lynx 2.8.5 | Konqueror 3.3.2 | Netscape 4.7 | IE 6.0
-
So, da bin ich noch einmal. Mich läßt das einfach nicht in ruhe...
Wie kann ich nun die Größe solcher Elemente verändern?
Wie bekomme ich die Nav.elemente ganz an den linken Rand? Habe einiges ausprobiert, aber langsam wird es anstrengend.Hier der aktuelle Code:
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" href="style.css" type="text/css">
<title>Nav mit CSS</title>
</head>
<body><ul id="navigation">
<li id="menu1"><a href="#">Test1</a></li>
<li id="menu2"><a href="#">Test2</a></li>
<li id="menu3"><a href="#">Test3</a></li>
<li id="menu4"><a href="#">Test4</a></li>
</ul></body>
</html>------------------
body{
margin-top: 0px;
margin-left: 0px;
}ul#navigation li {
display: inline;
margin-right: 5px;
margin-left: 0px;
padding: 3px;
width: 150px;
text-align:center;
}#navigation a:link { color:black; text-decoration: none;}
#navigation a:visited { color:black; text-decoration: none;}
#navigation a:hover { color:white; text-decoration: none;}
#navigation a:active { color:black; text-decoration: none;}#menu1
{
background: red;
}#menu2
{
background: orange;
}#menu3
{
background: green;
}#menu4
{
background: violet;
}-
Hallo Alex.
Wie kann ich nun die Größe solcher Elemente verändern?
Wie bereits erwähnt, musst du sie per display:block; formatieren, damit sie empfänglich für Dimensionsangaben werden.
Wie bekomme ich die Nav.elemente ganz an den linken Rand? Habe einiges ausprobiert, aber langsam wird es anstrengend.
Also behindert dich momentan was? Richtig, ein Abstand. Womit du diesen regulieren kannst, findest du sicher selbst heraus.
Hier der aktuelle Code:
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
Mit diesem inkorrekten DOCTYPE (ich schreibe dieses Wort nicht ohne Grund groß) befindet sich der IE (und alle anderen Browser, die darüber verfügen) im Quirksmodus.
Du solltest vielleicht dein wichtigstes Werkzeug kennenlernen: den Validator.
body{
margin-top: 0px;
margin-left: 0px;
}Warum nicht gleich Nägel mit Köpfen machen und margin und padding für html und body auf 0 setzen? (Im gleichen Atemzug könntest du die Höhe für beide auf 100% setzen, man weiß nie, wann man dies gebrauchen kann.)
ul#navigation li {
display: inline;
margin-right: 5px;
margin-left: 0px;
padding: 3px;
width: 150px;
text-align:center;
}Wie ich bereits (mehrmals) erwähnt habe, gelten Breitenangaben nicht auf Inlineelemente, wozu auch das li-Element gehört.
Eine Übersicht dazu findest du (wie immer) bei SelfHTML.#navigation a:link { color:black; text-decoration: none;}
#navigation a:visited { color:black; text-decoration: none;}
#navigation a:hover { color:white; text-decoration: none;}
#navigation a:active { color:black; text-decoration: none;}Die Redundanz kannst du vermeiden; definierst du text-decoration für a:link, gilt es ebenso für alle anderen Stati, sofern du es nicht dort überschreibst.
#menu1
#menu2
#menu3
#menu4
Lasse dir meinen Hinweis bezüglich der ID-Bezeichnungen durch den Kopf gehen.
Einen schönen Dienstag noch.
Gruß, Ashura
--
Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
30 Days to becoming an Opera8 Lover -- Keyboard Shortcuts
Meine Browser: Opera 8.50 | Firefox 1.0.7 | Lynx 2.8.5 | Konqueror 3.3.2 | Netscape 4.7 | IE 6.0
-
Hallo Alex.
Wie kann ich nun die Größe solcher Elemente verändern?
Wie bereits erwähnt, musst du sie per display:block; formatieren, damit sie empfänglich für Dimensionsangaben werden.
Ja verstanden, aber ich möchte, dass dieses Menü in einer Reihe dargestellt wird. Warum also nun :block? Oder erst :block, dann "width" und dann inline?
Wie bekomme ich die Nav.elemente ganz an den linken Rand? Habe einiges ausprobiert, aber langsam wird es anstrengend.
Also behindert dich momentan was? Richtig, ein Abstand. Womit du diesen regulieren kannst, findest du sicher selbst heraus.
Hier der aktuelle Code:
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
Mit diesem inkorrekten DOCTYPE (ich schreibe dieses Wort nicht ohne Grund groß) befindet sich der IE (und alle anderen Browser, die darüber verfügen) im Quirksmodus.
Danke, schon wieder was gelernt!
Du solltest vielleicht dein wichtigstes Werkzeug kennenlernen: den Validator.
body{
margin-top: 0px;
margin-left: 0px;
}Warum nicht gleich Nägel mit Köpfen machen und margin und padding für html und body auf 0 setzen? (Im gleichen Atemzug könntest du die Höhe für beide auf 100% setzen, man weiß nie, wann man dies gebrauchen kann.)
Auch mit margin: 0px; padding: 0px; erhalte ich immer noch einen linken Abstand. Liegt wahrscheinlich an den Elementen selbst, da diese j anichts anderes als Listen sind. Werd noch mal schauen...
ul#navigation li {
display: inline;
margin-right: 5px;
margin-left: 0px;
padding: 3px;
width: 150px;
text-align:center;
}Wie ich bereits (mehrmals) erwähnt habe, gelten Breitenangaben nicht auf Inlineelemente, wozu auch das li-Element gehört.
Ich hab schon einiges ausprobiert! Da bleibt einiges schon mal hängen :-)
Eine Übersicht dazu findest du (wie immer) bei SelfHTML.
#navigation a:link { color:black; text-decoration: none;}
#navigation a:visited { color:black; text-decoration: none;}
#navigation a:hover { color:white; text-decoration: none;}
#navigation a:active { color:black; text-decoration: none;}Die Redundanz kannst du vermeiden; definierst du text-decoration für a:link, gilt es ebenso für alle anderen Stati, sofern du es nicht dort überschreibst.
Hehehehe. Das funktioniert zwar beim Firefox, nicht aber beim IE!!!
#menu1
#menu2
#menu3
#menu4
Lasse dir meinen Hinweis bezüglich der ID-Bezeichnungen durch den Kopf gehen.
Zum Experimentieren sind diese IDs vorerst völlig ausreichend...
Einen schönen Dienstag noch.
Gruß, Ashura
Dir auch, gleich kannst du mir schon einen schönen Mittwoch wünschen...
Bis bald :-),
Alex-
Hallo Alex.
Ja verstanden, aber ich möchte, dass dieses Menü in einer Reihe dargestellt wird. Warum also nun :block? Oder erst :block, dann "width" und dann inline?
In diesem Fall (was du eher hättest erwähnen können) ist das display:inline erforderlich, ja.
Oder aber du wendest float auf die li-Elemente an.Auch mit margin: 0px; padding: 0px; erhalte ich immer noch einen linken Abstand. Liegt wahrscheinlich an den Elementen selbst, da diese j anichts anderes als Listen sind. Werd noch mal schauen...
Richtig. Wenn du für die Liste und deren Punkte andere Abstände haben möchtest, musst du diese auch festlegen.
Ansonsten überlässt du dem Browser die Darstellung.Die Redundanz kannst du vermeiden; definierst du text-decoration für a:link, gilt es ebenso für alle anderen Stati, sofern du es nicht dort überschreibst.
Hehehehe. Das funktioniert zwar beim Firefox, nicht aber beim IE!!!
Merkwürdig aber nachvollziehbar, es handelt sich schließlich um den IE.
Einen schönen Dienstag noch.
Dir auch, gleich kannst du mir schon einen schönen Mittwoch wünschen...
Ohje, so spät schon...
Einen schönen Dienstag noch.
Gruß, Ashura
--
Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
30 Days to becoming an Opera8 Lover -- Keyboard Shortcuts
Meine Browser: Opera 8.50 | Firefox 1.0.7 | Lynx 2.8.5 | Konqueror 3.3.2 | Netscape 4.7 | IE 6.0
-
Ich bin's mal wieder, aber bei so viel konstruktive Kritik macht das auch richtig Spaß...
Ja verstanden, aber ich möchte, dass dieses Menü in einer Reihe dargestellt wird. Warum also nun :block? Oder erst :block, dann "width" und dann inline?
In diesem Fall (was du eher hättest erwähnen können) ist das display:inline erforderlich, ja.
In meinen ganz frühen Posts habe ich geschrieben, dass ich diese "buttons" gerne in einer Reihe haben möchte...
Dann kann ich abe rmit inline die Breite dieser Buttons nicht angeben, ODER?!?!?!?Oder aber du wendest float auf die li-Elemente an.
Hmm, das muss ich mir MORGEN noch mal in Ruhe anschauen...
Ist das genau das, was ich suche?Wie gesagt, ich möchte eine horizontale Menüleiste haben, mit einer von mir definierten "Buttonbreite". Außerdem soll jeder Button eine andere Farbe zugewiesen bekommen. Das kann doch nicht so schwer sein?!
Ein andere Teilnehmer hat mir schon einen Interssanten Link zugesandt. Den werde ich morgen mal durchgehen...Danke,
Alex-
Hallo Alex.
Ich bin's mal wieder, aber bei so viel konstruktive Kritik macht das auch richtig Spaß...
Ebenso.
In meinen ganz frühen Posts habe ich geschrieben, dass ich diese "buttons" gerne in einer Reihe haben möchte...
In diesem Fall muss ich dies überlesen haben, also mein Fehler.
Dann kann ich abe rmit inline die Breite dieser Buttons nicht angeben, ODER?!?!?!?
Nein.
Oder aber du wendest float auf die li-Elemente an.
Hmm, das muss ich mir MORGEN noch mal in Ruhe anschauen...
Ist das genau das, was ich suche?Wenn du Breitenangaben *und* die Listenelemente nebeneinander haben möchtest, ist float in der Tat das, was du suchst.
(Verzichte dann aber auf jegliche Formatierung bezüglich der display-Eigenschaft.)Wie gesagt, ich möchte eine horizontale Menüleiste haben, mit einer von mir definierten "Buttonbreite". Außerdem soll jeder Button eine andere Farbe zugewiesen bekommen. Das kann doch nicht so schwer sein?!
Langsam aber sicher nähern sich die beiden Sachen wieder.
Wie du die Listenpunkte nun horizontal ausrichten kannst, dürftest du nun mitbekommen haben.
Die Farben wirst du wohl oder übel (IE-„konform“) mit ID-Selektoren vornehmen müssen, wie du es bisher geplant hast.Einen schönen Mittwoch noch.
(Du solltest Recht behalten.)Gruß, Ashura
--
Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
30 Days to becoming an Opera8 Lover -- Keyboard Shortcuts
Meine Browser: Opera 8.50 | Firefox 1.0.7 | Lynx 2.8.5 | Konqueror 3.3.2 | Netscape 4.7 | IE 6.0
-
-
-
-
-
Hi,
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
nicht nur die Kleinschreibung ist fehlerhaft; bei diesem Doctype geht der IE6 ohne Angabe der DTD stets in den quirks mode.
body{
margin-top: 0px;
margin-left: 0px;
}Browser könnten auch padding für html voreingestellt haben.
ul#navigation li {
ul (und auch li) können voreingestellte margin und padding haben.
display: inline;
width: 150px;wie schon gesagt schließt sich das aus. Lies mal http://de.selfhtml.org/css/layouts/navigationsleisten.htm#horizontal.
text-align:center;
findest Du das sinnvoll?
#navigation a:link { color:black; text-decoration: none;}
#navigation a:visited { color:black; text-decoration: none;}
#navigation a:hover { color:white; text-decoration: none;}
#navigation a:active { color:black; text-decoration: none;}wie schon gesagt geht das wesentlich kürzer:
#navigation a { color:black; text-decoration: none; }
#navigation a:hover { color:white; }#menu1
{
background: red;
}das hilft wenig, wenn Du die darin befindlichen Elemente anders formatierst.
freundliche Grüße
Ingo-
Hi,
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
nicht nur die Kleinschreibung ist fehlerhaft; bei diesem Doctype geht der IE6 ohne Angabe der DTD stets in den quirks mode.Danke, werd ich korregieren!
body{
margin-top: 0px;
margin-left: 0px;
}
Browser könnten auch padding für html voreingestellt haben.Habe ich bereits geändert, funktioniert aber immer noch. Liegt das vielleicht an den Eigenschaften der Liste?
ul#navigation li {
ul (und auch li) können voreingestellte margin und padding haben.display: inline;
width: 150px;
wie schon gesagt schließt sich das aus. Lies mal http://de.selfhtml.org/css/layouts/navigationsleisten.htm#horizontal.Das scheint ja ganz interssant zu sein. Danke, werde ich gleich mal durchlesen...
text-align:center;
findest Du das sinnvoll?Ja, warum nicht? Dieses Attribut zentriert mir den Text in Ihrem Rahmen... Sollte zumindest...
#navigation a:link { color:black; text-decoration: none;}
#navigation a:visited { color:black; text-decoration: none;}
#navigation a:hover { color:white; text-decoration: none;}
#navigation a:active { color:black; text-decoration: none;}
wie schon gesagt geht das wesentlich kürzer:
#navigation a { color:black; text-decoration: none; }
#navigation a:hover { color:white; }Ja, aber nur im Firefox, IE macht da nicht mit!!
#menu1
{
background: red;
}
das hilft wenig, wenn Du die darin befindlichen Elemente anders formatierst.???? Wieso? Wie denn sonst? Ich versuch mit gerade intensivst mit CSS, und es scheint nicht so trival zu sein wie gedacht...
freundliche Grüße
IngoGruss,
Alex-
Hi,
Browser könnten auch padding für html voreingestellt haben.
Habe ich bereits geändert, funktioniert aber immer noch. Liegt das vielleicht an den Eigenschaften der Liste?
ul (und auch li) können voreingestellte margin und padding haben.
text-align:center;
findest Du das sinnvoll?Ja, warum nicht? Dieses Attribut zentriert mir den Text in Ihrem Rahmen...
Weil Zentrierung nicht immer sinnvoll ist und gerade eine Navigation eher unübersichtlich machen kann.
#navigation a { color:black; text-decoration: none; }
#navigation a:hover { color:white; }Ja, aber nur im Firefox, IE macht da nicht mit!!
Dann müssen da noch andere Angaben dazwischenfunken.
#menu1
{
background: red;
}
das hilft wenig, wenn Du die darin befindlichen Elemente anders formatierst.???? Wieso?
Oops, sorry. Ich hatte die Angaben zu color mit background verwechselt.
freundliche Grüße
Ingo
-
-
-
-
-
-
-
-
-
-
So, ich habe es geschafft!
An dieser Stelle noch mal ein GROSSES "DANKE SCHÖN" an Ingo Turski und Ashura.
Der Link http://de.selfhtml.org/css/layouts/navigationsleisten.htm#horizontal hat mir dann sehr geholfen. Danke.Und hier das Resultat:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" href="style.css" type="text/css">
<title>Nav mit CSS</title>
</head>
<body><ul id="navigation">
<li><a id="menu1" href="#">Test1</a></li>
<li><a id="menu2" href="#">Test2</a></li>
<li><a id="menu3" href="#">Test3</a></li>
<li><a id="menu4" href="#">Test3</a></li>
</ul></body>
</html>-----------------------
body{
margin: 0px;
padding: 0px;
}ul#navigation {
margin: 0px;
padding: 0px;
text-align: center;}
ul#navigation li {
list-style: none;
display: inline;
margin: 0px;
padding: 0px;
}ul#navigation a{
float: left;
width: 100px;
text-decoration: none;
margin-right: 5px;
}#navigation a:link { color:black;}
#navigation a:visited { color:black;}
#navigation a:hover { color:white;}
#navigation a:active { color:black;}#menu1
{
background: red;
}#menu2
{
background: orange;
}#menu3
{
background: green;
}#menu4
{
background: violet;
}------------------------
Noch ein Hinweis an alle: Da CSS mit dem IE eine heikle Sache ist, sollte man immer vorsichtig sein. Ich habe hier gelernt, dass der IE noch einiges dazulernen muss. (Siehe dazu die Links in den Posts)
Danke,
Alex-
Hallo Alex.
So, ich habe es geschafft!
An dieser Stelle noch mal ein GROSSES "DANKE SCHÖN" an Ingo Turski und Ashura.
Und ich bedanke mich für deine Mitarbeit sowie deine erneute Rückmeldung; dies ist recht selten.
Einen schönen Mittwoch noch.
Gruß, Ashura
--
Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
30 Days to becoming an Opera8 Lover -- Keyboard Shortcuts
Meine Browser: Opera 8.50 | Firefox 1.0.7 | Lynx 2.8.5 | Konqueror 3.3.2 | Netscape 4.7 | IE 6.0
-
Hallo Ashura
Und ich bedanke mich für deine Mitarbeit sowie deine erneute Rückmeldung; dies ist recht selten.
Das ist doch selbstverständlich...
Und weil mir das so gut hier gefallen hat, komme ich nun öfters vorbei. Registriert hab ich mich auch schon.Gruß,
Alex
-
-
-