Problem mit Elementausrichtung

[andy-1988]

Hab mal wieder ein Problem:

Hab oben ne überschrift in nem <div> element (wegen dem hintergrundbild).
Darunter erneut ein <div> indem sich ein Bild und darunter ein kleiner Text steht, die Beide in einem Link stecken. Daneben hab ich nun Text.

Dieses Schema wiederholt sich.

mein problem ist nun, dass das die erneute überschrift nicht unterhalb von dem bild + link anfängt, sondern am ende des Textes (der mit <p> erzeugt is. Somit also mitten im nächsten bild die nächste überschrift ist und das ganze nicht passt....

hier mal der code dazu:

<div class="teilue">
    <p class="teilue">Löschgruppenfahrzeug - LF 8/6</p>
  </div>
  <div id="div_fahrzeugbild">
    <a href="/fahrzeuge/lf8_6.php" title="Zu den Bildern des LF 8/6"><img src="/fahrzeuge/vorschau/lf8_6.jpg" id="img"></a><br>
    <a href="/fahrzeuge/lf8_6.php" title="Zu den Bildern des LF 8/6">(mehr Bilder)</a>
  </div>
  <p>
    <ul class="fahrzeuge">
      <li class="fahrzeuge">Baujahr 2002</li>
      <li class="fahrzeuge">9 Mann Gruppenbesatzung</li>
      <li class="fahrzeuge">800 Liter Wassertank</li>
      <li class="fahrzeuge">Normbeladung</li>
      <li class="fahrzeuge">4 Atemschutzgeräte</li>
      <li class="fahrzeuge">technische Hilfeleistung<br> 
          (hydraulische Schere und Spreizer)</li>
    </ul>
  </p>

und hier die entsprechenden CSS daten:

p.teilue {font: bold 12px Verdana, Arial; text-decoration:none; color:#9A0000; margin-left:5px; padding-top:1px; padding-bottom:3px; text-align:center;}
div.teilue {background-image:url(images/seitenelemente/teilue.gif);}
#div_fahrzeugbild {border:0px; width:259px; float:left; text-align:center;}
ul.fahrzeuge {margin-left:245px;}
li.fahrzeuge {padding:3px;}

 

[_Thor_]

Hab oben ne überschrift in nem <div> element (wegen dem hintergrundbild).

Ich seh keine Überschrift, nur nen Textabsatz in einem <div>, welches nichts gruppiert.

mein problem ist nun, dass das die erneute überschrift nicht unterhalb von dem bild + link anfängt, sondern am ende des Textes (der mit <p> erzeugt is. Somit also mitten im nächsten bild die nächste überschrift ist und das ganze nicht passt....

Kann ich mir gerade nicht so richtig vorstellen, gib uns mal bitte nen Link zur Seite. Sollte sie noch nicht online sein, stell sie online!

 

[prm]

Da sind gleich mehrere Dinge verbesserungswürdig:

Für Überschriften solltest du keine Textabsätze verwenden. Dazu gibt es die Überschriftenelemente h1 bis h6. Auch diesen kannst du eine Hintergrundgrafik zuweisen.

Die ul-Liste darf sich nicht innerhalb eines Absatzes befinden.

Das deine "Überschriften", nebeneinander angeordnet werden, liegt wohl an der float-Angabe vom image.

Um die Links untereinander anzuordnen müsstest du ihnen "display: block;" zuweisen.

Ansonsten poste bitte einen Link, damit man das mal auch im Zusammenhang mit den Grafiken sieht.

 

[andy-1988]

Also dass mit den <ul> und den überschriften hab ich nun gändert. jetzt ist nur noch mein problem mit den überschriften... hier is der link: Freiwillige Feuerwehr Mönchsroth

 

[andy-1988]

hab das problem gelöst... hab verbessern zu clearen...