überschrift und bild in einer zeile (HTML)

6 Antworten

Vom Beitragsersteller als hilfreich ausgezeichnet
MaraB
13.06.2012, 17:11 
<div style="float:left; width: 80px;">
<img src="test.jpg" width="50px" height="80px">
</div>
<div style="float:left; width: 100px; margin-top: 30px">
<h1>Überschrift</h1>
</div>
<div style="float:left; width: 80px;">
<img src="test.jpg" width="50px" height="80px">
</div>
Elroy7000  13.06.2012, 19:45

Für was sollen die 3 unnötigen divs gut sein? Und warum wird 3 mal nach links gefloatet?

MaraB  13.06.2012, 20:30
@Elroy7000

Ich habe das aus einer Vorlage für ein dreispaltiges Layout so übernommen.

Elroy7000  14.06.2012, 06:18
@MaraB

Dann war das aber eine ganz misserable Vorlage. Bei einem 3-Spalten Layout wird einmal nach rechts und einmal nach links gefloatet.

Und dann stimmt natütlich die Reihenfolge nicht. Weil erst die zwei Bilder und dann die Überschrift kommt.

Die divs sind auch unnötig weil da nichts ist was gruppiert werden muss.

MaraB  15.06.2012, 07:21
@Elroy7000

Bei einem 3-Spalten Layout wird einmal nach rechts und einmal nach links gefloatet.

Das halte ich nicht für eine "Gesetzmäßigkeit" und wie sollte das dann bei einem vierspaltigen Text funktionieren? Und so miserabel finde ich die Vorlage gar nicht. Aber mir reicht es manchmal auch, dass es einfach nur funktioniert.
webpeg
16.06.2012, 21:10

Hallo mach es so, wie Mara es dir ganz toll erklärt hat. nach links wird immer gefloatet, damit man auch mehr divs nebeneinander legen kann. das erste geht ganz nach links, das zweite schließt sich dort an u.s.w. Der Abstand der verschiedenen Divs wird per padding definiert. LG Peggy
Bjoern96
13.06.2012, 17:08

Würde mit float:left funktionieren:

<img id="Logo" style="float:left" /><h1 style="float:left">Überschrift</h1><img id="Logo2">
Elroy7000
Nutzer, der sehr aktiv auf gutefrage ist
im Thema HTML
13.06.2012, 19:42

Das bekommst du mit CSS hin, indem du das eine Bild nach links und das andere nach rechts floatest.

Suchbegriff: CSS float