vertical-align fehler

[Krobbus]

irgendwie kriege ich das mit vertical-align nicht richtig hin, wie muss mein quelltest aussehen damit das ergebnis so dargestellt wird wie auf dem bild unten?

<img style="vertical-align:top;" src="images/bspbild.jpeg" >1. Name des Notebooks<br>Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung

(http://img691.imageshack.us/img691/7153/vertalign.gif)

 

[Gilles]

im CSS musst du dem Image noch ein float: left geben

 

[Krobbus]

Danke, Gilles!
Eine Frage hab ich noch: Wie mache ich es jetzt, das rechts neben dem text noch eine spalte entsteht, wo ich zusätzlichen text reinschreiben kann? ich hab das vorher immer mit ner tabelle gemacht, aber ich glaube das kann man eleganter lösen oder? (wer nicht weiß was ich meine: die gesamtbreite des aktuellen bereiches wo das bild und der text drin ist soll schmaler werden, damit rechts daneben noch eine unabhängige spalte entsteht)

 

[Gilles]

Also soll das Image mit dem Umfliessenden Text ein teil für sich und rechts daneben noch ein weiterer Text sein?

mach einen Div um den text mit Bild. und dann machst du darauf auch wieder einen float left. dann kannst du dein anderes element psoitionieren und es wird rechts davon angezeigt. hier nun mal der HTML-Aufbau wie es aussehen könnte

<div>
  <img>
  <p>umfliessender Text</p>
</div>
<p>
rechter Text
</p>

 

[Krobbus]

Bringt leider nichts, der text wird einfach in einer neuen Zeile unten drunter angezeigt. Kann mir das nicht erklären, habe mal meinen kompletten Qtext mit Css datei angehängt, gibt das vielleicht irgendnen konflikt mit den anderen div's?

CSS Datei:

.post {
padding-bottom: 15px;
line-height: 200%;
}
.entry {
padding: 0 20px;
}

php datei:

<div class="post">

<div class="entry">
<div style="float:left;">
<img style="vertical-align:top; float:left; padding-right:10px;" src="images/bspbild.jpeg" >1. Name des Notebooks<br>Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung
</div>
<p>dieser text soll rechts angezeigt werden</p>
</div>
</div>

 

[Elroy]

Hallo.

Du hast <p>Beschreibung....</p> vergessen.
Liess dir nochmal Gilles Beispiel in aller Ruhe durch.

Gruss
Elroy