@@Matthias Apsel:
nuqneH
<div id="gallery"><img id="photo" ...><p id="label">...</p></div>
Du wirst sicher mehrere Fotos haben wollen. Deshalb ist die ID Photo nicht günstig, gleiches gilt für das div gallery.
Günstig könnte auch der Einsatz des Markups sein, den HTML5 bereithält:
<figure>
<img src="foo"/>
<figcaption>Lorem ipsum</figcaption>
</figure>
Zu beachten ist dabei, dass man für nicht ganz aktuelle Browser
figure, figcaption {display: block}
angeben muss und alten IEs mit JavaScript auf die Sprünge helfen muss:
document.createElement('figure');
document.createElement('figcaption');
Textalign ist die Eigenschaft, die dir beim Ausrichten von Text hilft.
?? Diese verhält sich schon ohne weites Zutun wie gewünscht, d.h. als ob "left gesetzt wäre (bei LTR-Text).
Man muss allerdings den Container ('figure') so schmal machen, wie es das Bild erfordert. Shrink-to-fit sollte bei Zentrierung schwierig werden: absolute Positionierung ist nicht das, was man möchte; 'float' scheidet aus.
Aber wenn man die Breite des Bildes kennt, weist man diese dem Container zu:
figure
{
display: block;
margin: auto;
width: 666px;
}
Qapla'
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
(Mark Twain)