PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : CSS Dinge untereinander zentrieren


marc26
25.07.2006, 17:01:42
hiho,

ich habe thumbnails (50x50px). Unter jedem Thumbnail soll zentriert ein Name (Text) auftauchen und darunter wiederum eine Checkbox, ebenso zentriert.

Ich weiss nicht wie viele von diesen Thumb/Name/Checkbox-Blöcken angezeigt werden. Wenn nicht mehr aureichend Platz ist soll er automatisch in der nächsten Zeile weitermachen.

Deshalb möchte ich verhindern mit einem solchen...


<div id="thumbs" style="width:800px;">

<table>

<tr>

<td align="center">

<img /><br />
Chris<br />
<input />

</td>

</tr>

</table>

</div>


Tabellenkonstrukt zu arbeiten (mit modulo würde das irgendwie zu aufwendig/kompliziert).

Irgendwie krieg ich das mit CSS trotz floats auch nicht hin, ist aber auch sehr heiss...

Dankbar für Eure Hilfe, Marc

Jens0815
26.07.2006, 01:24:45
Ich habe es nicht ausprobiert aber versuche doch die Tabbellen mit divs zumachen.

<div>
Bild
<div>andere Sachen</div>
</div>

feuervogel
26.07.2006, 07:14:29
Tabellenkonstrukt zu arbeiten (mit modulo würde das irgendwie zu aufwendig/kompliziert).


wo modulo doch so ne schöne sache ist!

xabbuh
26.07.2006, 09:33:01
Der Nachteil an Tabellen ist, dass Zellen, die in einer Zeile keinen Platz mehr haben, für horizontale Scrollbalken sorgen. div-Elemente mit der CSS-Eigenschaft float:left wären hier imho der bessere Weg, was dann grob skizziert so aussehen könnte:

<div style="float-left;">
<img /><br />
Name
<input type="checkbox" />
</div>
<div style="float-left;">
<img /><br />
Name
<input type="checkbox" />
</div>
<div style="float-left;">
<img /><br />
Name
<input type="checkbox" />
</div>

<!-- usw. -->