[CSS] von Mozilla, Links und width-Angaben

Nase · 22. Februar 2004

Hallo,

warum geht solch ein Code nicht mit Mozilla/Firebird?

Code:

.menu_c:link, .menu_c:visited {
	background-color: #DEE8EC;
	border-left: 5px #a5b8c3 solid;
	color: #4e6572;
	padding-left: 10px;
	text-decoration: none;
	width: 180px;
}

.menu_c:hover, .menu_c:active {
	background-color: #a5b8c3;
	border-left: 5px #4e6572 solid;
	color: #ffffff;
	padding-left: 10px;
	text-decoration: none;
	width: 180px;
}

Das Problem besteht darin, dass die Links nicht die Breite von 180px bekommen. IE und Opera haben damit keine Schwierigkeiten. Kann es sein, dass solch eine Deklaration nicht regelkonform ist?

CrazyWolf · 22. Februar 2004

hmm ich hab auch noch nie gesehen dass man links eine breite zuweisen kann. Bei Tabellen ja, aber links? Wie sieht das Ergebnis denn beim IE aus?

Nase · 22. Februar 2004

Sieht aus wie ein Div mit Text drin, nur dass, wenn man mit der Maus drüber geht, die Hintergrundfarbe wechselt, und das ganze anklickbar ist.

The Prophet · 22. Februar 2004

Stell mal ne Bsp. Datei Online hab gerade keine Lust das selber zu machen um es zu testen

, interessieren tut es mich auch....

Nase · 22. Februar 2004

Jup, hier.

Steffen · 22. Februar 2004

Links (a-Tags) sind per Default Inline- und keine Block-Elemente (wie z.B. div-Tags). Deshalb musst du die Eigenschaft "display:block" setzen, dann wendet Mozilla auch die Breite korrekt an.

Nase · 22. Februar 2004

Wahoo, besten Dank, es funktioniert.

The Prophet · 22. Februar 2004

Mal wieder was gelernt

Funktioniert nun in Firefox, IE, Mozilla, Opera und Co...

Nase · 22. Februar 2004

Nur merk ich gerade noch einen anderen Fehler von Mozilla (oder von den anderen Browsern?). Bei Mozilla ist ein Link mit den oben angegebenen Attributen nicht 180px breit, sondern 195px (180px width + 5px border-left + 10px padding-left?). Wer hat nun Recht? Und wie kann man das umgehen?

Loopo · 22. Februar 2004

das Objekt müsste eigentlich dann 185 px breit sein, es sei denn Objekte darin sind zu groß ...

Nase · 22. Februar 2004

Loopo schrieb:
das Objekt müsste eigentlich dann 185 px breit sein, es sei denn Objekte darin sind zu groß ...

Der Text nimmt je Link nicht mehr als 2/3 der Breite ein. Ok, es sind nicht ganz 195px, eher so 193px?! Irgendwie macht das alles keinen Spass mehr

.

Steffen · 23. Februar 2004

Wie die Browser den HTML-Code interpretieren, legst du per Doctype fest. Im standardkonformen Modus ist die Breite eines Elements definiert als die Breite des Inhalts ohne Padding, Border und Margin! Im Quirks-Modus sind Broder und Padding jedoch in der Breite enthalten. Siehe dazu: http://jessey.net/simon/articles/003.html

Wenn du also einen Doctype wie z.B.

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

als erste Zeile in deiner HTML-Datei platzierst, verhalten sich alle Browser korrekt (Ausnahme IE < 6.0).

Nase · 23. Februar 2004

Und nochmal, besten Dank, funktioniert. Allerdings genau entgegen deiner Beschreibung.

Steffen · 23. Februar 2004

Hängt halt davon ab, welches Ergebnis man erreichen möchte. Standard- oder Quirks-Mode, wobei der Standard-Modus zukunftssicherer ist.

Nase · 23. Februar 2004

Wenn ich dich aber richtig verstanden habe, dann wird der Standard-Modus nur erreicht, wenn man ein Doctype angibt. Im Standard-Modus werden Padding, Border etc. nicht mitgewertet.
Jetzt hab ich aber hier nun ein Doctype eingefügt, und nun verhält sich die Seite in allen Browsern so, wie anfangs im Mozilla. Also so, dass Border, Padding mitgezählt werden.

PuppetMaster · 23. Februar 2004

Standard-Modus (also mit Doctype): Deine Breitenangabe definiert nur den Inhalt, dazu(!) kommen dann Padding, Border und Margin.
Ist schon richtig so.

Nase · 23. Februar 2004

Auf jedenfall funktioniet jetzt nun alles. Noch mal besten Dank an alle die mir geholfen haben.

Steffen · 23. Februar 2004

Das kommt drauf an, welchen Doctype du setzt. Bei ein paar Doctypes aktivieren die Browser trotzdem den Quirks-Mode. Bei welchen das der Fall ist, siehst du in der Tabelle unten auf einer Seite, die ich in einem früheren Beitrag verlinkt habe.

Nase · 23. Februar 2004

Steffen schrieb:
Das kommt drauf an, welchen Doctype du setzt. Bei ein paar Doctypes aktivieren die Browser trotzdem den Quirks-Mode. Bei welchen das der Fall ist, siehst du in der Tabelle unten auf einer Seite, die ich in einem früheren Beitrag verlinkt habe.

Hab mir das nochmal durchgelesen, benutze jetzt HTML 4.01 Strict und nicht mehr Transitional. Hat aber nicht verändert, da meine Seite auch in diesem Modus keine Fehler beinhaltet

.

MaOaM · 23. Februar 2004

Wäre jemand so nett mir zu erklären, wo der Unterschied zwischen Standart- und Quirks-Mode ist?

Danke im Voraus

Gnom66

[CSS] von Mozilla, Links und width-Angaben

Nase

Gast

Lt. Commander

Nase

Gast

Anhänge

Rear Admiral

Nase

Gast

Anhänge

Technische Leitung

Nase

Gast

Rear Admiral

Nase

Gast

Admiral

Nase

Gast

Technische Leitung

Nase

Gast

Technische Leitung

Nase

Gast

Admiral

Nase

Gast

Technische Leitung

Nase

Gast

Lt. Commander

Ähnliche Themen