Tabelle mit bildern

[Krobbus]

hi, bin relativer neuling, wär nett wenn mir jemand helfen könnte.

1.) ich möchte ne tabelle mit 2 spalten und 2 zeilen erstellen.
allerdings soll sich in 2 von den 4 entstehenden feldern auf der linken seite text, und auf der rechten seite ein bild befinden. wie geht das?

2.) ich habe folgende layout vorgaben:
margin:0 0 20px 0;
padding:10px;
border:1px solid #c0c0c0;
background-color:#fafbfc;
color:#505050;
line-height:1.5em;
muss ich dir irgendwie umformatieren (sie stammen ursprünglich aus einer css datei und ich kriegs nicht hin das meine tabelle so aussieht wie ein <div class=""> aufruf der den code ausruft. (aber ohne tabelle, das klappt)

 

[littleHtml Freak]

du tust einfach in die tabelle ein bild rein^^

<table border="0">
<tr>
    <td><div class="deine klasse">dein Text</div></td>
    <td><div class="deine klasse">dein 2.Text</div></td>
 </tr>
 <tr>
    <td><img src="URL des Bildes" /></td>
    <td><img src="URL des 2.Bildes /></td>"
 </tr>
</table>

in einer tabelle kannst du den text so behandeln, als wenn er nicht in einer tabelle wäre, auch bilder, links usw. sind möglich
mfg

 

[Efchen]

Hallo zusammen,

hier eine Tabelle zu verwenden, ist semantisch sicher nicht einwandfrei. Ich würde stattdessen die bei Bildern mit dazugehörigem Text üblicherweise verwendete Definitionsliste (<dl>) verwenden.

Dann muss man auch nicht sowas lesen wie "in einer tabelle kannst du den text so behandeln, als wenn er nicht in einer tabelle wäre" oder "ich kriegs nicht hin das meine tabelle so aussieht wie ein <div class="">" :-)

Die Behandlung einer Definitionsliste ist auch definitiv einfacher, und optisch kann man mit CSS ja ohnehin alles erreichen, was man will, unabhängig vom HTML-Tag.

Viele Grüße,
-Efchen

 

[littleHtml Freak]

wie säh denn so ein code aus?
ich dachte immer eine tab sei die einzige möglichkeit bilder nebeneinander zu setzten.
mfg

 

[Efchen]

Hallöchen,

ich dachte immer eine tab sei die einzige möglichkeit bilder nebeneinander zu setzten.

Aua! Eine Tabelle ist die einzige Möglichkeit, tabellarische Daten auszuzeichnen. Für das Layout verwendet man grundsätzlich kein HTML mehr, seit es CSS gibt (ca. 10 Jahre).
Warum Layout mit Tabellen dumm ist: Probleme definiert, Lösungen angeboten

Viele tun sich in der Tat schwer damit, HTML zu verstehen, und dann klappts leider meist auch nicht mit CSS.
UND leider gibt es immer noch Lehrer, Website-Tutorials und die Mundpropaganda, die immer noch abgelaufene Dinge wie den Benutz-Tabellen-fürs-Layout-Hack, Frames und sonstigen Kram weiterempfehlen.

Dabei ist alles so einfach!

wie säh denn so ein code aus?

SELFHTML: HTML/XHTML / Elemente zur Textstrukturierung / Listen

<dl>
  <dt>
    <img src="bild1.jpg" alt="Bild vom Wolpertinger" />
  </dt>
  <dd>
    Dies ist der Wolpertinger. Blabla lorem ipsum.
  </dd>
  <dt>
    <img src="bild2.jpg" alt="Bild vom Hurz" />
  </dt>
  <dd>
    Dies ist ein Hurz. Der Brunftlaut ist "Hurz".
  </dd>
</dl>

Die CSS-Formatierung ist ja dann wiederum variabel. Im Zweifelsfall so:

dl dt
{
  clear:left;
  float:left;
}

Code ungetestet :-)

Gruß,
-Efchen