rob-master: Welchen DTD

hey jungs,

ich bin mir gerade etwas unsicher.
Die folgende Website habe ich gerade mit CSS so halb fertig erstellt nur verunsichert mich der
DOCTYPE auf der Seite, den ich verwendet habe:

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

Der Transitional Document type ist ja sehr nachgiebiger, was die W3C Vorgabenden betrifft.
Verwende ich einen restiktiveren DTD, schaut meine Website auch schon ganz anders aus :(
Gerade die CSS Angabe "height:100%;" wird mit diesem DTD nicht verarbeitet:

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

Wie definiert ihr für einen Div Container die Höhe?
Weiterhin würde mich interessieren, wie ihr das Thema DTD
handhabt (welchen nutzt ihr bei euchen Projekten)?
Hier mal mein Sourcecode

<div style="width:738px;height:100%;position:relative;margin:0px auto;text-align:left;background-color:#ffffff;">
   <div style="width:738px;height:300">
    <div id="logo"><img src="images/logo.gif" alt="Ofenscheune" width="303" height="58"></div>
    <div id="topicimg">
     <img src="images/topic_img.jpg" width="505" height="238"><img src="images/fire.jpg" width="233" height="238">
    </div>
    <div id="navi"><br>
     <img src="images/kaminoefen.png" width="114" height="27"><img src="images/kamine.png" width="112" height="27"><img src="images/kacheloefen.png" width="113" height="27"><img src="images/ratgeber.png" width="113" height="27"><img src="images/firmenprofil.png" width="113" height="27"><img src="images/kontakt.png" width="113" height="27">
    </div>
   </div>
   <div id="subnavi">> links</div>
   <div id="content"> hier ist der content</div>
  </div>

Die Auszug aus dem Stylesheet:
#topicimg {
position:absolute;
top:30px;
left:0px;
z-index:1;
}
#logo {
position:absolute;
top:10px;
left:400px;
z-index:2;
}
#navi {
position:absolute;
top:180px;
left:0px;
z-index:2;
}
#content {
border:1px solid #efeff7;
background-color:#efeff7;
width:610px;
float:right;
padding:0px 10px;
}
#subnavi {
border:1px solid #efeff7;
background-color:#efeff7;
width:125px;
float:left;
padding:0px 10px;
}

Danke & Gruss

Rob

  1. Hi,

    Der Transitional Document type ist ja sehr nachgiebiger, was die W3C Vorgabenden betrifft.

    nein. Er stammt ebenfalls vom W3C und ist ebenso streng definiert, wie es bei Strict der Fall ist. Der Umfang ist lediglich rößer.

    Verwende ich einen restiktiveren DTD, schaut meine Website auch schon ganz anders aus :(

    Das liegt an den Browsern, die bei manchen DOCTYPEs in den Quirks-Mode schalten. _Hier_ sind die _Browser_ sehr viel nachgiebiger, was die W3C-Vorgaben betrifft - und machen insbesondere im Falle des IE noch sehr viel mehr Fehler als sonst. Vermeide dies *unbedingt*.

    Wie definiert ihr für einen Div Container die Höhe?

    a) Exakt so wie für jedes andere Element.
    b) Mit der height-Angabe.

    Weiterhin würde mich interessieren, wie ihr das Thema DTD
    handhabt (welchen nutzt ihr bei euchen Projekten)?

    So, dass niemals ein Browser in den Quirks-Mode schaltet.

    <div id="navi"><br>

    Wozu dient hier der Inhalt eines Umbruches?

    <img src="images/kaminoefen.png" width="114" height="27"><img src="images/kamine.png" width="112" height="27"><img src="images/kacheloefen.png" width="113" height="27"><img src="images/ratgeber.png" width="113" height="27"><img src="images/firmenprofil.png" width="113" height="27"><img src="images/kontakt.png" width="113" height="27">

    Wenn Du eine Liste hast, warum benutzt Du dann kein entsprechendes Strukturelement?

    <div id="subnavi">> links</div>

    ">" ist in HTML ein Sonderzeichen. Sonderzeichen müssen kodiert werden. Immer und überall.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hello out there!

      ">" ist in HTML ein Sonderzeichen. Sonderzeichen müssen kodiert werden. Immer und überall.

      <Loriot>Ach. Ach was.</Loriot> ;-)

      „Autoren, die das »<«-Zeichen im Text einsetzen wollen, sollten »&lt;« (ASCII dezimal 60) verwenden, um mögliche Verwechslungen mit dem Beginn eines Tags (öffnender Begrenzer des Start-Tags, start tag open delimiter) zu vermeiden. Analog sollten Autoren im Text »&gt;« (ASCII dezimal 62) anstelle von »>« benutzen. Sie gehen damit Problemen aus dem Wege, die in älteren Benutzerprogrammen auftreten können. Dies kann dann passieren, wenn »>« innnerhalb von in Anführungszeichen stehenden Attributwerte auftaucht und ein Benutzerprogramm darin fälschlicherweise das Ende eines Tags (schließender Tag-Begrenzer) erkennt.“ [HTML401 §5.3.2]

      Das ist valide:

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
      <html>  
         <head>  
          <title>Test</title>  
          <meta http-equiv="content-type" content="text/html; charset=UTF-8">  
        </head>  
        <body>  
          <p>>foo</p>  
        </body>  
      </html>
      

      Das auch:

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
      <html>  
         <head>  
          <title>Test</title>  
          <meta http-equiv="content-type" content="text/html; charset=UTF-8">  
        </head>  
        <body>  
          <p>< foo</p>  
        </body>  
      </html>
      

      Nur das nicht (element "FOO" undefined):

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
      <html>  
         <head>  
          <title>Test</title>  
          <meta http-equiv="content-type" content="text/html; charset=UTF-8">  
        </head>  
        <body>  
          <p><foo</p>  
        </body>  
      </html>
      

      Allerdings: Sonderzeichen _sollten_ kodiert* werden. Immer und überall.

      See ya up the road,
      Gunnar

      * Mit kodiert meintest du als Entity-Referenzen oder NCR geschrieben werden? Kodiert werden sie ja immer: wahlweise in UTF-8, ISO 8859-1, ... ;-)

      --
      “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)