width angabe geht nicht im nn6+
frank
- css
hallo,
da ich meine links mit css formatieren möchte und sie einen button effekt haben sollen, wurden sie per css auf eine breite von 107px gesetzt.
leider funktioniert das bisher nur im i.e richtig.
hier mal der verwendete css-code:
.mnlslidehr { width:107px; font:bold 10px Verdana, Arial, Helvetica, sans-serif; }
A.mnlslidehr { BORDER-RIGHT: #BA892C 1px solid; BORDER-TOP: #FFEB99 1px solid; BORDER-LEFT: #FFEB99 1px solid; CURSOR: hand; BORDER-BOTTOM: #BA892C 1px solid; PADDING:2px; BACKGROUND-COLOR: #FFCC00; COLOR:#ffffff; width:107px; text-decoration:none;}
A.mnlslidehr:visited { BORDER-RIGHT: #BA892C 1px solid; BORDER-TOP: #FFEB99 1px solid; BORDER-LEFT: #FFEB99 1px solid; CURSOR: hand; BORDER-BOTTOM: #BA892C 1px solid; PADDING:2px; BACKGROUND-COLOR: #FFCC00; COLOR:#ffffff; width:107px; text-decoration:none;}
A.mnlslidehr:hover { BORDER-RIGHT: #FFEB99 1px solid; BORDER-TOP: #BA892C 1px solid; BORDER-LEFT: #BA892C 1px solid; BORDER-BOTTOM: #FFEB99 1px solid; BACKGROUND-COLOR: #FFE066; COLOR:#DF0632; width:107px; }
A.mnlslidehr:active { COLOR: #DF0632; TEXT-DECORATION: none; width:107px; }
die width angabe wird nur vom i.e. 5+ richtig interpretiert, obwohl der nn6+ laut css1 definition diesa angabe verstehen müsste.
die links ruf ich dann so auf: <a href="irgendwas" class="mnlslidehr"></a>
weiß jemand rat?
danke
frank
Hi Frank,
da ich meine links mit css formatieren möchte und sie einen button effekt haben sollen, wurden sie per css auf eine breite von 107px gesetzt.
wenn der M$IE eine andere Breite rendert als gute Browser, liegt er falsch (Box Model Bug). Welchen Doctype verwendest du? Ein guter Suchbegriff für dich ist Doctype Switching.
So ist's richtig: Angezeigte Breite = width + padding + border + margin.
leider funktioniert das bisher nur im i.e richtig.
Das bezweifle ich. Aber vielleicht hat N6 einen Bug (er ist eine ziemliche Krücke), teste besser mit N7.
LG Roland
hallo roland,
habe das problem umgangen,
der link sitzt in einer tablle, welche genauso breit wie der link (107px) ist.
da ich ja eh diverse css für die gängigen browser benutze.
bekommt der nn6/7 nun eine klasse, welche die tabelle per hover, etc ansteuert. der im css für den msie hingegen ist diese klasse nicht definiert.
damit kann ich leben und es funktioniert.
frank
Hi,
da ich meine links mit css formatieren möchte und sie einen button effekt haben sollen, wurden sie per css auf eine breite von 107px gesetzt.
wenn der M$IE eine andere Breite rendert als gute Browser, liegt er falsch (Box Model Bug).
Nein, ausnahmsweise ist das mal nicht der Box Bug.
leider funktioniert das bisher nur im i.e richtig.
auch falsch.
a ist ein non-replaced inline-Element. width ist aber auf non-replaced-inline-Elemente nicht anwendbar:
'width'
Value: <length> | <percentage> | auto | inherit
Initial: auto
Applies to: all elements but non-replaced inline elements, table rows, and row groups
Inherited: no
Percentages: refer to width of containing block
Media: visual
(http://www.w3.org/TR/REC-CSS2/visudet.html#propdef-width)
cu,
Andreas
Hi Andreas,
da ich meine links
tjo, hab' ich wohl überlesen - das passiert mir relativ oft in letzter Zeit. Ich sollte besser nicht nebenbei arbeiten ;)
LG Roland
da ich meine links mit css formatieren möchte und sie einen button effekt haben sollen, wurden sie per css auf eine breite von 107px gesetzt.
leider funktioniert das bisher nur im i.e richtig.
Nein, da funktioniert es offensichtlich falsch. Erfahrungsgemäß kann man davon ausgehen, daß bei Unterschieden zwischen IE und Gecko-Browsern (Netscape 6+, Mozilla und Co) der IE es falsch macht und die Gecko-Teile richtig.
Bei Deiner unten stehenden Konstruktion wirst Du zum Beispiel auch auf den IE-Fehler treffen, die Breite (width), Rand (border-width) und Abständen (padding/margin) falsch zu berechnen.
Generell solltest Du Gecko-Browser zum Testen benutzen und die Browser in den Standardmodus setzen: http://www.hut.fi/~hsivonen/doctype.html. Nur dann kannst Du Dich auf das verlassen, was in den CSS-Dokus steht.
A.mnlslidehr { BORDER-RIGHT: #BA892C 1px solid; BORDER-TOP: #FFEB99 1px solid; BORDER-LEFT: #FFEB99 1px solid; CURSOR: hand; BORDER-BOTTOM: #BA892C 1px solid; PADDING:2px; BACKGROUND-COLOR: #FFCC00; COLOR:#ffffff; width:107px; text-decoration:none;}
Die width-Eigenschaft funktioniert nur bei Blockelementen, <a>-Elemente fallen aber standardmäßig in die Kategorie "inline". Dementsprechend kann width nicht bei <a> funktionieren. Siehe http://www.w3.org/TR/CSS2/visudet.html#the-width-property.
Abhilfe: <a> in Blockelemente verwandeln: display:block. Fragt sich nur, was passiert, wenn die Texte breiter als 107 Pixel sind..
Gruß,
soenk.e
Hi,
Die width-Eigenschaft funktioniert nur bei Blockelementen,
Falsch, siehe auch mein anderes Posting:
all elements but non-replaced inline elements, table rows, and row groups
Das sind etwas mehr als "nur Blockelemente".
cu,
Andreas
Die width-Eigenschaft funktioniert nur bei Blockelementen,
Falsch, siehe auch mein anderes Posting:
all elements but non-replaced inline elements, table rows, and row groups
Das sind etwas mehr als "nur Blockelemente".
Ja, Herr. Auch wenn ich bezweifle, daß diese Korinte aus Franks Sicht momentan einen nennenswerten Unterschied macht.. :>
Gruß,
soenk.e
Ja, Herr. Auch wenn ich bezweifle, daß diese Korinte aus Franks Sicht momentan einen nennenswerten Unterschied macht.. :>
Hi,
...da wir gerade dabei sind:
Korinthen [frz. raisins de Corinthe >Korinther Trauben<, nach Korinth]
-> also auch die gekackte Korinthe so wie die griechische Stadt mit "th"
siehe auch:
http://www.korinthenkacker-club.de/
(nein, ich bin nicht Ehrenmitglied)
Inzaire