nicht angemeldet
Bildunterschriften
Guten Morgen Forum,
Also es gibt in einer Spalte 4 Bilder untereinander. Jedem wird eine Bildunterschrift gegeben. Geht es einfacher(besser) als unten ?
<div class="box_left">
<img src="../../images/home/zentrale.jpg" alt="" />
<div class="picsub">Headquaters, Dortmund</div>
<img src="../../images/shop/mitarbeiter_dortmund.jpg" alt="" />
<div class="picsub">Team Dortmund</div>
<img src="../../images/shop/halle.jpg" alt="" />
<div class="picsub">Production </div>
<img src="../../images/home/mitarbeiter.jpg" alt="" />
<div class="picsub">Team Lippendorf</div>
</div>
.box_left {
width: 80%;
background-image: url("../images/design/edge_red_top_left.png");
background-position: top left;
background-repeat: no-repeat;
border-right: 2px solid #000;
border-bottom: 2px solid #000;
background-color: #fff;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
padding: 0.5em;
text-align: left;
}
.picsub {
font-size: 0.8em;
margin-top: 0.5em;
margin-bottom: 1em;
}
-
Hallo,
Also es gibt in einer Spalte 4 Bilder untereinander. Jedem wird eine Bildunterschrift gegeben. Geht es einfacher(besser) als unten ?
du könntest auf die (inneren) Divs verzichten mit img {display:block}.
Vom Inhalt ausgehend könnte es vielleicht auch als Liste umgesetzt werden.
Grüsse
Cyx23
-
du könntest auf die (inneren) Divs verzichten mit img {display:block}.
Was genau macht das "display: block" ?
Vom Inhalt ausgehend könnte es vielleicht auch als Liste umgesetzt werden.
Bilder als Liste? Ich weiß nicht.
-
Habe es doch noch gefunden:
http://www.w3.org/TR/CSS21/visuren.html#propdef-display
Könnte mir jemand mal Beispiele für die Display Eigenschaften geben? Wann "block" verwenden? Wann "inline", etc ?
-
Hi,
Könnte mir jemand mal Beispiele für die Display Eigenschaften geben? Wann "block" verwenden? Wann "inline", etc ?
das kannst Du Dir eigentlich auch selbst beantworten: immer dann, wenn Du inline-Eigenschaften oder Eigenschaften, die nur für inline-Elemente gelten, benötigst.
Da diese jetzt speziell für IMG selten brauche, definiere ich hierfür meist display:block, was einige Vorteile mit sich bringt.freundliche Grüße
Ingo
-
-
Hallo,
Was genau macht das "display: block" ?
es erzeugt (im Gegensatz zu display:inline) einen Zeilenumbruch.
Dabei sind aber die inneren Divs (Blockelemente) in deinem Ausgangscode
auch nicht falsch, nur wird die Beziehung von Text und Bild durch das
Div nicht strukturell abgebildet.
Das wäre hier vielleicht schon eher gegeben, allerdings ist align="bottom"
etwas altmodisch:
<p><img src="../../images/home/zentrale.jpg" align="bottom">
Headquaters, Dortmund</p>
<p><imgBilder als Liste? Ich weiß nicht.
Muss ja nicht sein, das wäre die Frage ob dein Inhalt als
eine Aufzählung von Bildern betrachtet werden könnte.Zu display und auch zu Listen müssten in SelfHTML Beispiele sein,
und zu deiner Frage findet sich vmtl. auch etwas im Forums-Archiv,
vielleicht bei Suche nach "img align css" o.ä..Grüsse
Cyx23
-
-