Hintergrund - Füllt nicht alles aus? (Browser-abhängig!)

[Ako]

Grüße!

Seht euch doch bitte diese Seite an:

http://coder.pyrokar.lima-city.de/hmm.php

Der Internet-Explorer füllt "korrekt" die ganze Spalte mit dem Hintergrund.
Der Opera-Browser füllt fast die ganze Spalte, nur lässt er rechts, wo ein Rahmen !wäre!, einfach frei und der Hintergrund endet ein Pixel zu früh.
Der Netscape-Browser und der Mozilla Firefox-Browser lassen links ein Pixel frei.

Das ist blöd für mein Design, denn dann ist das Hintergrundbild verschoben und es schließt nicht mehr mit dem restlichen Design ;)

Gibt es eine Lösung für alle Browser?

MfG

[afra]

Hallo Ako!

Gibt es eine Lösung für alle Browser?

Ja, sauberes Markup und keine Designtabellen.

Wenn du zwei

<p></p>
<p></p>

oder

<hx></hx>
<p></p>

untereinander angibst und diese so formatierst, wie Du es mit Deiner Tabelle gemacht hast, dann hast Du den selben Effekt und 20 Zeilen weniger Code.

Solltest Du später jedoch wirklich _tabellarischen_ Inhalt in Deiner Tabelle anzeigen wollen, dann solltest Du Dir nochmals anschauen, ob eine  Border nicht doch etwa zu angegebenen Breiten _dazu_ gezählt wird... Da Du aber keinerlei doctype in Deinem Dokument angibst, ist das auch alles nur Spekulation, da so die verschiedenen Browser _irgend_ etwas darstellen.

Schönen Gruß

Afra

[Ako]

Grüße!

Habe den Code nun abgeändert. Ein Doctype ist nun vorhanden, und die untere Zelle hat nur noch 198 Pixel Breite. Trotzdem hat sich nichts verändert.

MfG

http://coder.pyrokar.lima-city.de/hmm.php

[afra]

Hallo Ako!

Habe den Code nun abgeändert. Ein Doctype ist nun vorhanden, und die untere Zelle hat nur noch 198 Pixel Breite. Trotzdem hat sich nichts verändert.

Was hast Du denn nun geändert? Es ist immer noch eine Tabelle deren Breite und weiter unten auch TD-Breite auf 200px festgezurrt ist. Dass darin irgendwo einmal 198px Breite definiert sind, juckt die anderen breiteren Zellen nicht. Was hoffst Du damit zu erreichen?

Das ist ein Link: http://coder.pyrokar.lima-city.de/hmm.php

Schönen Gruß

[Ako]

Ich bin verwirrt.

Am besten, ich gebe das Design mit Tabellen auf! Habe schon ein wenig mit <p> herumexperimentiert, doch habe ich ein Problem:

Vier <p> Elemente nebeneinander sollen es sein, und zwar sind es links und rechts außen "Linien" nach unten, links innen ein Menü und rechts innen der Inhalt.

Nun möchte ich, dass diese vier Elemente immer gleiche höhe haben, sonst schließt mein Design unten nicht ab.

(Wenn das Inhalt-Element durch zB. Text etwas höher wird, sollen sich die anderen Elemente der Höhe anpassen!)

Wie realisiert man so etwas?

MfG

[Ingo Turski]

Hi,

Vier <p> Elemente nebeneinander sollen es sein, und zwar sind es links und rechts außen "Linien" nach unten, links innen ein Menü und rechts innen der Inhalt.

das sind aber keine sinnvollen Textabsätze, gell?
Du möchtest eher ein zweispaltiges Layout mit einem Rahmen haben, also etwa wie http://de.selfhtml.org/css/layouts/anzeige/hintergrund.htm oder etwas einfacher wie http://de.selfhtml.org/css/layouts/anzeige/2spaltig_breite.htm.

freundliche Grüße
Ingo

[Ako]

Grüße!

Ich werde die Spalten ausnahmsweise mit Tabellen machen.

Neues Problem: Der Internet Explorer inkludiert in der <p> Breite den Rahmen, aber der Netscape nicht.
Daher ist im Netscape die Breite mit Rahmen 200px und im Internet Explorer nur 198px.

Gibt es eine Lösung für beide Browser? Sollte immer gleich aussehen.

(Wiegesagt, im Internet Explorer ist die Breite gleich Breite ohne Rahmen, im Netscape ist die Breite gleich Breite + Rahmen!)

[afra]

Hallo Ako!

Neues Problem: Der Internet Explorer inkludiert in der <p> Breite den Rahmen, aber der Netscape nicht.
Daher ist im Netscape die Breite mit Rahmen 200px und im Internet Explorer nur 198px.

Mud Guard hatte Dir schon einen Ansatz genannt gehabt. Ich auch.  Wenn Du diese Beiträge aufmerksam gelesen hättest, würdest Du jetzt wissen, dass Du Deinen IE aus dem Quirksmode holen musst um ihn Standardkonform das Box Modell darstellen zu lassen.

D.h.: Der IE behandelt Breitenangabe + Border + Margin völlig anders als der FF oder Netscape wenn dieser im Quirksmode rumlungert.

Mehr dazu

Schönen Gruß

Afra

[Ako]

Grüße!

Mein Dokument beginnt doch mit:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

[Ako]

(Vergesst die lima-city Seite, die meine ich nicht)

[Ashura]

Hallo Ako.

Mein Dokument beginnt doch mit:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Eben. Und damit schickst du den IE in den Quirksmodus.

Details kannst du dem entsprechenden <http://de.selfhtml.org/css/formate/box_modell.htm#standardkonform@title=Kapitel in SELFHTML> entnehmen.

Einen schönen Mittwoch noch.

Gruß, Ashura

[Ako]

Grüße!

Vielen Dank für die Seite! Ich nehme an, du meinst den Tan-Hack.

* html #stats { /* Tan Hack */
w\idth: 190px;
}

So einfach geht das, jedoch bleibt im Opera-Browser der "Fehler" erhalten :(

Internet Explorer, Netscape und Mozilla Firefox zeigen nun volle Breite inklusive Rahmen an, der Opera zählt die Rahmen nicht mit.

Also die Breite beträgt 190px, Rahmen links und rechts mit 1px, trotzdem ist die Gesamtbreite 190px, so wie ich es möchte. Lediglich der Opera zeigt nur 188px.

#stats {
width: 188px;
height: 200px;
background-color: #333333;
border-style: solid;
border-width: 1px;
border-top: 0px;
border-color: #666666;
vertical-align: top;
margin: 0px;
padding: 0px;
}

* html #stats { /* Tan Hack */
w\idth: 190px;
}

Ich hoffe, man kann hier noch was machen.
MfG

[Auge]

Hallo

Vielen Dank für die Seite! Ich nehme an, du meinst den Tan-Hack.

Ich hoffe, man kann hier noch was machen.

Ja, man kann den MSIE >= 6  aus dem quirks mode holen (Angabe der URI der entsprechenden DTD im DOCTYE-Tag, siehe: http://de.selfhtml.org/html/allgemein/grundgeruest.htm#dokumenttyp).
Wurde ja hier schon mehrfach gesagt.

Dann sind 200px die Breite _inclusive_ des Borders (und des Margin), so wie es Opera und Moz/FF machen und wie es der Standard festlegt. Bleibt nur noch, für die älteren MSIE mit Hacks oder Conditional Comment zu arbeiten.

*btw* Wenn du die Seite nicht so angelegt hättest, dass sie pixelgenau passen muss, gäbe es die ganzen Probleme überhaupt nicht.
Du kannst sowieso nicht voraussagen, mit welchem Programm deine Besucher Zugriff auf deine Seite nehmen. Somit kannst du nicht voraussagen, ob dein Layout genauso dargestellt wird, wie du es dir gedacht hast. Du hast also, anders, als z.B. bei einem PDF, keine volle Kontrolle über die Darstellung, da du nicht weißt, ob und inwieweit das Anzeigeprogramm deinen CSS-Anweisungen folgt oder folgen kann.

Tschö, Auge

[MudGuard]

Hi,

Mud Guard

Ich fühl mich so gespalten ...

cu,
Andreas

[MudGuard]

Hi,

Der Internet-Explorer füllt "korrekt" die ganze Spalte mit dem Hintergrund.
Der Opera-Browser füllt fast die ganze Spalte, nur lässt er rechts, wo ein Rahmen !wäre!, einfach frei und der Hintergrund endet ein Pixel zu früh.
Der Netscape-Browser und der Mozilla Firefox-Browser lassen links ein Pixel frei.

Du hast schon mal widersprüchliche Breitenangaben: die gesamte Tabelle soll 200px breit sein - die Zelle in der zweiten Zeile aber 202px breit (width 200px + links und rechts border von 1px).

Unklar ist, warum Du überhaupt eine Tabelle verwendest.

Aufgrund des fehlenden Doctypes schickst Du die Browser in den Quirks mode - fehlerhafte Interpretation wird dadurch noch gefördert.

cu,
Andreas