CSS Problem

[Lux]

@@Lux

gibt es die Möglichkeit, in einer Bilderliste die Bildüberschrift in den Bildrahmen zu integrieren?

Dan Rahmen nicht img geben, sondern figure.

figcaption absolut positionieren. Damit sich die Positionierung auf figure bezieht, dieses relativ positionieren.

Hm, ich habs jetzt genau umgekehrt gemacht. Den Rahmen habe ich beim image gelassen, dann figure relative positioniert und figcapture absoilut. So steht die Schrift innerhalb des Rahmens und sobald es mehr Schrift wird, wandert sie nach oben, notfalls bis ins Bild hinein.

Sieht im moment gut aus, gibt es hiergegen Einwände (z.b. das es in manchen Browsern nicht läuft oder so)?

Relatively position the figure so we can absolutely position the caption over the photo

.my_image {
background: #f5f5f5;
border-top: 8px solid #FFF;
border-right: 8px solid #FFF;
border-bottom: 60px solid #FFF;
border-left: 8px solid #FFF;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 1px 2px 4px rgba(0,0,0,.4);
margin-top:10px; 
margin-left:0px; 
margin-bottom:10px; 
margin-right:10px;
}


figure {
  position: relative;

}

figcaption {
  position: absolute;
  bottom: 15px;
  left: 8px;
  padding: 20px;

}