[doctype/table hoogte] verband? - Softwareontwikkeling

zaterdag 9 april 2005 13:46

Acties:

Hallo?

Topicstarter

Tijdens het in elkaar zetten van een webpagina ben ik het volgende tegen gekomen. Wanneer ik bovenin de html pagina de volgende code zet (die dreamweaver vaak automatisch genereert):

code:

1	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

gaat er iets mis met de hoogte van een tabel in de pagina. Een table met hoogte 100% wordt namelijk weergegeven als een table die helemaal geen hoogte heeft ingesteld.

Dus deze code geeft een tabel van een pixel of 120 hoog.

code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><title>test</title></head><br>
<body style="margin:0px">
<table height="100%" >
  <tr><td bgcolor="#009959">&nbsp;</td></tr>
  <tr><td bgcolor="#009299" height="100">&nbsp;</td></tr>
</table>
</body>
</html>

En deze code geeft een tabel met hoogte 100%

code:

<html><head><title>test</title></head><br>
<body style="margin:0px">
<table height="100%" >
  <tr><td bgcolor="#009959">&nbsp;</td></tr>
  <tr><td bgcolor="#009299" height="100">&nbsp;</td></tr>
</table>
</body>
</html>

Kan iemand me uitleggen waarom?

3d-en is leuk

zaterdag 9 april 2005 13:50

Acties:

Verwijderd

In HTML 4.01 heeft het table element helemaal geen height attribuut. Aangezien je met een doctype declaration aangeeft welke specificaties je wenst te gebruiken, zal een goede user agent die niet-bestaande attributen in elk geval moeten negeren.

zaterdag 9 april 2005 13:52

Acties:

Verwijderd

zie: http://www.w3.org/TR/html401/struct/tables.html#edef-TABLE
table heeft dus geen height attribuut

met doctype houdt IE zich netjes aan de specs en heb je dus een auto hoogte.
Je kan het met CSS oplossen als je wilt, of gewoon geen tabellen voor opmaak gebruiken

, nog beter

edit: spuit 11

en wat doet die br na je head? yuk!

[ Voor 10% gewijzigd door Verwijderd op 09-04-2005 13:53 ]

zaterdag 9 april 2005 13:56

Acties:

Millennium

Bug free !!!

Verwijderd schreef op zaterdag 09 april 2005 @ 13:52:

en wat doet die br na je head? yuk!

De body op de volgende regel zetten natuurlijk.

Ontopic: Als je een tabel van 100% hoog wil hebben, kan je het beste:

code:

<html>
  <head>
    <title>test</title>
  </head>
  <body style="margin:0px">
  <table>
    <tr>
      <td height="100%>
        <table>
           <tr><td bgcolor="#009959">&nbsp;</td></tr>
           <tr><td bgcolor="#009299" height="100">&nbsp;</td></tr>
        </table>
      </td>
    </tr>
  </table>
</body>
</html>

[ Voor 85% gewijzigd door Millennium op 09-04-2005 14:01 . Reden: even netjes in een code blok gezet ]

Rampen bak 2004

zaterdag 9 april 2005 14:01

Acties:

coubertin119

Millennium, ik mag hopen dat je grappig wil zijn, anders zie ik me genoodzaakt de ouderwetse schandpaal boven te halen

.

En waarom zorg je er niet met CSS voor dat je tabel er juist uitziet. Of waarom maak je geen gebruik van HTML zoals het bedoeld is en ga je aan de slag op een semantische manier?

Skat! Skat! Skat!

zaterdag 9 april 2005 14:03

Acties:

alientje

Hallo?

Topicstarter

Dank voor de reacties. Ik heb de laatste tijd te weinig tijd om me te verdiepen in alle standaarden

Die <br> was trouwens een beetje automatisme van mijn kant. Dreamweaver plakt een <br> als je in de code view op Shift+enter drukt

3d-en is leuk

zaterdag 9 april 2005 14:14

Acties:

Millennium

Bug free !!!

coubertin119 schreef op zaterdag 09 april 2005 @ 14:01:
Millennium, ik mag hopen dat je grappig wil zijn, anders zie ik me genoodzaakt de ouderwetse schandpaal boven te halen .

En waarom zorg je er niet met CSS voor dat je tabel er juist uitziet. Of waarom maak je geen gebruik van HTML zoals het bedoeld is en ga je aan de slag op een semantische manier?

Als je bedoelt het deel voor ontopic, dat was grappig bedoelt idd.

het ontopic deel was vrij serieus. Hoewel ik zelf geen full body tables gebruik. Is het een werkende oplossing.

maargoed een style="height: 100%" in je table werkt ook.

edit:

Voordat ik nog meer aan de figuurlijke paal genageld wordt.

code:

<html><head><title>test</title></head>
<body style="margin:0px">
<table class="containertable" >
  <tr><td bgcolor="#009959">&nbsp;</td></tr>
  <tr><td bgcolor="#009299" height="100">&nbsp;</td></tr>
</table>
</body>
</html>

met een Cascade Style Sheet waarin staat:

code:

1
2
3

.containertable {
  height: 100%;
}

[ Voor 31% gewijzigd door Millennium op 09-04-2005 14:19 ]

Rampen bak 2004