Stefan Richter: Problem mit DocType und Div

SELF-Forum

Problem mit DocType und Div

Stefan Richter
– Informationen zu den Bewertungsregeln

Hallo,

habe da ein Problem mit einem HTML Layout... bin grad dabei eine SelectBox selbst zu erstellen.
Dazu lege ich 3 Div's nebeneinander, links leer, mitte Inputfeld, rechts Pfeiltasten...

Okay.

Habe da nur folgendes Problem:

Sobald ich den DocType angebe, wird in dem Beispiel unten der zweite Layer (im Firefox, Opera) 2 Pixel nach unten verschoben... im Internet Explorer funktioniert es wunderbar.
Entferne ich den DocType klappt es auch wieder in allen Browsern.

Kann mir jemand erklären woran das liegt?

Grüße

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

<HTML>

<HEAD>

</HEAD>

<BODY style="margin:20px">

<DIV style="height:18px;float:left"><IMG src="images/controls/s1left.gif" style="height:18px"></DIV>

<DIV style="height:18px;float:left">

<DIV style="height:9px"><IMG src="images/controls/s1up.gif" style="height:9px"></DIV>

<DIV style="height:9px"><IMG src="images/controls/s1down.gif" style="height:9px"></DIV>

</DIV>

<DIV style="clear:left"></DIV>

</BODY>

</HTML>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Problem mit DocType und Div

    wucher wichtel
    – Informationen zu den Bewertungsregeln

    Hallo!

    Vielleicht liegt es daran, dass dein Doctype nicht vollständig ist?

    ciao, ww

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

  2. Problem mit DocType und Div

    D.R. Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo,

    habe da ein Problem mit einem HTML Layout... bin grad dabei eine SelectBox selbst zu erstellen.

    Die befindet sich aber anscheinend nicht im unten geposteten Quellcode.

    Dazu lege ich 3 Div's nebeneinander,

    OK

    links leer,

    Wozu?

    mitte Inputfeld, rechts Pfeiltasten...

    Ich sehe kein <input />

    Habe da nur folgendes Problem:

    Sobald ich den DocType angebe, wird in dem Beispiel unten der zweite Layer (im Firefox, Opera) 2 Pixel nach unten verschoben...

    Mein Glaskugel sagt mir, dass dieses Problem bei dir im Zusammenhang mit Bildern auftritt.
    Gib den Bildern mal eine von „vertical-align:baseline“ abweichende Eigenschaft. Etwa „vertical-align:middle“, oder mache die Bilder zu Block-Elementen.

    im Internet Explorer funktioniert es wunderbar.

    Der Quirksmode von dem Teil reicht weiter als du denkst.

    Entferne ich den DocType klappt es auch wieder in allen Browsern.

    Weil sie dann alle mache was sie wollen.

    Kann mir jemand erklären woran das liegt?

    s.o.

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

    Das versetzt zwar keinen bekannten Browser in den Quriksmode (da HTML4.01-Strict) ich würde die URI aber der Form halber trotzdem angeben.

    <HTML>

    <HEAD>

    Die Stylesheets kommen aber später noch hier hinein aber? Vermeide inline-Stile. Das mach den Quellcode übersichtlicher.

    </HEAD>
    […]
    <DIV style="height:18px;float:left"><IMG src="images/controls/s1left.gif" style="height:18px"></DIV>

    Hier fehlt das zwingend notwendige alt-Attribut.
    Wozu legst du die Höhe des <div> fest? Gib dem Bild statt dessen lieber noch eine Breite mit.

    mfg. Daniel

    --
    Experten raten von der Verwendung des Internet Explorers ab!
    Mein SELF-stylesheet | Darum Firefox!
    Selfcode: ie:{ fl:{ br:> va:) ls:[ fo:| rl:( n4:# ss:| de:> js:| ch:? mo:} zu:}
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln