Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden. Du solltest ein Upgrade durchführen oder einen alternativen Browser verwenden.
Es sind aber die meißten Browser. Nur durch die propietären präfixe (-moz- und -webkit-) funktionieren die Beispiele in den neusten ff und Safari.
Nur die Screenshots funktionieren im aktuellen IE und Opera.
Im IE8, Opera10.10 und ff2.0 sieht es nicht schön aus.
Edit:
Jetzt antwortet...
Alles was in den gängigen Browsern nur mit Präfix (-moz-, -webkit- usw) funktioniert kann nur ein Hack für bestimmte Browser sein.
Ein css welches alternativlos nur auf solche Eigenschaften baut ist in meinen Augen kaum praxistauglich.
Manchmal weiß ich bei sowas auch nicht weiter. Im schlimmsten Fall retuschiere ich solche Rundungsfehler mit einer Ziergrafik.
Hier ist es ein kleines Kreutz:
Geht natürlich nur bei Kunden die einem diese Wahl lassen.
Unter Linux habe ich nur den ff2.0. Dort gibt es keinen Seitenzoom (nur Textzoom).
Im IE8 (win7) kann ich die Verschiebung nicht provozieren. Allerdings im IE7. Dort hilft scheinbar Layout für .box .right:
.box .right {
zoom: 1;
}
Wenn das auch im IE8 hilft stimmt vielleicht etwas an deiner...
Es sind 3 Grafiken. Du kannst die große Grafik auch verkleinern bzw. teilen. Wenn du ein weiteres Element in h2 span und p a einfügst kannst du die Lücken mit einer Hintergrundfarbe oder einer kachelnden Hindergrundgrafik füllen.
Wobei ich aber immer versuche mit möglichst wenigen, einzelnen...
Ich weiß nicht wofür die Codezeilen in background stehen. Mit background-position: center; positionierte Hintergrundgrafiken liegen aber nicht immer px-genau über zentrierte Elemente.
Mir ist nicht klar ob sich die Box an der zur Verfügung stehenden Breite oder horizontal am Inhalt anpassen...
Der Rundungsfelfer in deinem Beispiel kommt bestimmt durch die leeren, ( seperat positionierten ) Elemente. In dem Beispiel von Andreas Kalt gibt es solche Elemente nicht. Jede Breite wird von innen bestimmt.
Das habe ich dazu gefunden:
HTML tbody
Firefox reagiert tatsächlich auf overflow für tbody. Andere Browser ignorieren es.
Du könntest thaed position: fixed; geben und dem div height + overflow: auto;
Dafür mußt du aber td und th jeweils passende Breiten geben. Außerdem klappt das im IE<8...
Aber bestimmt nicht mit overflow: auto; für table. Deine <div>Lösung ist doch ok.
Mit table-layout: auto; ist width immer nur eine Mindestbreite.
table-layout: fixed; braucht in der Praxis auch passende Breiten von td
Der aktuelle Safari schon, wenn table-layout auf fixed steht.
Für table ist overflow nicht gültig:
http://www.w3.org/TR/CSS2/visufx.html#overflow
Edit:
Ob es einen älteren Browser gibt der overflow auch auf table anwendet weiß ich nicht. Laut Spezifikation war das auch in css 2 nicht...
a ist auf display: inline;.
Wenn width und height greifen sollen könntest du z.B display: block; oder float: left; für a notieren.
Nachtrag
Ich würde aber raten a nicht inhaltsleer zu lassen.
Das stimmt so aber nicht. Es gibt auch andere (aufwendigere) Techniken.
Andere Methoden sind sicher nicht einfacher.
Ich kann aus deinem Code nicht erkennen was du genau willst.
Zu diesem geschlossenen Tread:
http://www.html.de/off-topic-plauderecke/21290-freiherr-von-gravenreuth.html
Günter Freiherr von Gravenreuth hat letzte Nacht suizid begangen.
Diese Seite verwendet Cookies, um Inhalte zu personalisieren und dich nach der Registrierung angemeldet zu halten. Durch die Nutzung unserer Webseite erklärst du dich damit einverstanden.