Problem mit Zeilenumbruch bei <h1>

xthetronx

Erfahrenes Mitglied
Hallo,

ich steh gerade ein bisschen auf dem Schlauch und hoffe ihr könnt mir helfen.

Wie man am Quellcode sieht, habe ich links ein Bild, danaben eine Überschrift in <h1> und darunter Fliesstext.
Leider gibt es keinen automatischen Zeilenumbrauch nach <h1>, so dass, je wie lang die Überschrift ist, der Fliesstext direkt nach oben und hinter die <h1> rutscht.

Das ist aber nicht gewünscht und wenn ich versuche z.B. mit <h1>:margin-right:200px; so weit zu verlängern, dass am Seitenrand umgebrochen wird, so klappt dass ja nur bei einer bestimmten Zeichenfolge. Sobald sie länger o. kürzer ist, wird wieder umgebrochen.

Hat vielleicht jemand einen Rat für mich?

Vielen Dank.
HTML:
.anleitung {
	background-color:#cccccc;
	border:1px solid blue;
	height:auto;
	margin-bottom:15px;
}
.anleitung img{
	float:left;
	border:2px solid red;	
	margin-right:10px;
}
h1 {
	width:auto;
	margin:0 100px 10px 0;
}
span.author {
	width:auto;
	font-size:11px;
	font-weight:bold;
	font-style:normal;
	color:#961207;
HTML:
<div class="anleitung">
<img class="anleitung" src="bild.jpg" alt="" width="150" height="180" />
<h1> Dies ist eine Überschrift</h1>
<span class="author">Fliesstext</span>
</div>
 
hab den code nicht getestet, aber hau mal in h1 display:block; ein.
just4fun. mal schauen obs dann funktioniert

gruß
Thorsten
 
Hallo Thorsten,

das hatte ich auch schon ausprobiert und trotzdem hast Du Recht. :)

Dein Einwurf hat mich auf die Idee gebracht, mal zu schauen, ob ich wo anders noch eine h1 Formatierung habe und da habe ich tatsächlich das hier gefunden:

HTML:
 h1, h2, h3, p {
	float:left;
	margin-left: 10px;
}

h1 rausgenommen und siehe da! Es klappt!

Danke für Deine Hilfe.

Gruß

Torsten
 
Zurück