Forum Sefrengo.org > Hilfe bei CSS float

Forum Sefrengo.org > Allgemeine Foren > Offtopic

FireFlyer

Fri. 7. January 2011, 15:28

Kann mir jemand helfen, denn ich komm mit dem float nicht zurecht. Hier ist das Problemkind. Der Text soll um das Bild fließen, was er ja auch macht, aber das Bild soll sich im DIV news aufhalten und nicht darüber hinaus gehen.

Hab schon so viel probiert mit float und clear. Ich komm einfach nicht weiter.

Bin für Hilfe dankbar!

pawel

Fri. 7. January 2011, 18:56

.news-views{clear:both} oder .news{overflow:auto}

Insgesamt gibts da jede Menge Verbesserungsmöglichkeiten im Markup.

FireFlyer

Sat. 8. January 2011, 11:04

Danke, die Kombi hat es gebracht.

Ich betreib des ganze nur als Hobby und nicht gewerblich, bitte um Nachsicht, wenn es da nicht so gut bei mir aussieht. Das floaten hat mir schon immer Probleme bereitet, aber da muss man durch!

Kannst du mir die Verbesserungsmöglichkeiten nennen?

pawel

Sat. 8. January 2011, 12:32

Statt diesem Markup:

QUELLTEXT

<div class="news">
<div class="news-title">Test 2</div>
<div><img src="http://www.fcbayernfanclub-merkendorf.de/cms/fcb/media/img/news/2011/on-tour_cms_thumb.jpg" style="float: left; margin: 5px;" alt="" height="100" width="78" border="1" />
</div>
<div class="news-teaser">Zwei ausgelaugte Kriegskameraden landeten 1945 oder 1946 in einem Entlassungs-lager der Briten in Merkendorf/Ostsee. Der Eine war aus Merkendorf/Bamberg und freute sich sicherlich, endlich nach Franke... - <a href="42a1066fd0939b87ddbd89aacb665d3c/der-verein/news.html&nid=4">weiterlesen</a></div>
<div class="news-views"><small>15 x gelesen</small></div>
</div>

wäre das sicher sinnvoller:

QUELLTEXT

<div class="news">
<h2>Test</h2>
<p><img src="" /> ..</p>
<p class="read">15x gelesen</p>
</div>

bzw. du nutzt die neuen Elemente von HTML5.

FireFlyer

Sat. 8. January 2011, 13:44

Ok, danke für die Hilfe!

Dieses ist eine vereinfachte Darstellung unseres Foreninhaltes. Um die detaillierte Vollansicht mit Formatierung und Bildern zu betrachten, bitte hier klicken.