PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Diagramm mit tables wie geht das valide?


/dev/NULL
2007-05-09, 23:02:29
Ich muß/möchte eine Statistik mit html machen, keine pixel gifs, keine sonstigen Sachen.

Was geht ist folgendes: (Dreamweaver)
Aber <table> in <tr> mag validome garnicht gern.

wie könnte ich unterschiedliche lange Zellen machen und trotzdem valide bleiben? (height mag er natürlich auch nicht :-/)

<table width="100%" border="0" cellspacing="0" cellpadding="0">

<tr bgcolor="#FFCCCC">
<td width="50" height="20">Ich</td>
<td width="50">30</td>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="120" height="20" bgcolor="#FF0000"></td>
<td width="280" height="20"></td>
</tr>
</table>
</td>
</tr>

<tr bgcolor="#FFCCCC">
<td width="50" height="20">Du</td>
<td width="50" height="20">27</td>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="108" height="20" bgcolor="#FF0000"></td>
<td width="292" height="20"></td>
</tr>
</table>
</td>
</tr>

</table>

mf_2
2007-05-10, 00:06:59
Statt "<td width="50" height="20">" lieber "<td style="width:50px;height:20px">".
Immer CSS (Cascading Style Sheets) verwenden, aber aufpassen mit der Kompatibilität (insbesondere zum Internet Explorer, der hats noch nicht so mit der CSS2.0 Interpretation). Lies einfach mal ein paar Sachen zum Thema CSS bei Selfhtml, da ist es sehr gut erklärt.

Ich habe das früher auch immer so gemacht mit width und height und dann alles mühsam auf CSS umgestellt, in ein paar sehr langen Nächten anno 2005. Daher mein dringender Rat: Lieber gleich CSS! Auch wenn nur 'width' und 'height' zu verwenden am Anfang einfacher aussehen mag, lass es! Nimm CSS!

Selbiges gilt übrigens für bgcolor!

Nimm dann sowas:
<td style="width:50px;height:20px;background-color:#FF0000;">

Immer dran denken, bei CSS nimmt man ":" statt "=" und jede Wertzuweisung schließt mit einem Semikolon.

Hoffe, dir geholfen zu haben.

mf_2
2007-05-10, 00:16:47
Ich hatte gerade etwas Zeit und habe das Ding durch den W3C Validator gejagt.

So kommt es durch:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><HTML><HEAD><TITLE></TITLE><meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"></HEAD>
<BODY>
<table width="100%" border="0" cellspacing="0" cellpadding="0">

<tr style="background-color:#FFCCCC;">
<td style="width:50px;height:20px;">Ich</td>
<td style="width:50px;">30</td>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="width:120px;height:20px;background-color:'FF0000"></td>
<td style="width:280px;height:20px;"></td>
</tr>
</table>
</td>
</tr>

<tr style="background-color:#FFCCCC;">
<td style="width:50px;height:20px;">Du</td>
<td style="width:50px;height:20px;">27</td>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="width:120px;height:20px;background-color:'FF0000"></td>
<td style="width:292px;height:20px;"></td>
</tr>
</table>
</td>
</tr>

</table>

</BODY></HTML>


Hier der Link zum Validator:
http://validator.w3.org/
Dort einfach die Datei raufladen bzw. die URL angeben.

Da meckert auch nichts wegen dem <TABLE> im <TR>.

/dev/NULL
2007-05-10, 09:13:11
Ich benutze schon stylesheets ":" (dreamweaver hat o.g. ausgespuckt) vermutlich lag es dann bei mir an meinem doctype ich hatte nur 4.0 bzw. xhtml versucht.

Ich teste mal!

Danke!

Nachtrag: ja,... wenn man statt ein </tr> ein <tr> macht meckert er.. kaum hab ich die ausgabefunktion angepasst scheint es zu gehen. Aber danke für die Hilfe! Jetzt noch ein paar Stylesheets dann schauts so aus wie es soll

DanMan
2007-05-12, 12:43:47
So: http://meyerweb.com/eric/css/edge/bargraph/demo-table.html