vertical-align fehler

html.de-Forum HTML, XHTML & CSS
1

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?

1. Name des Notebooks
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 )
http://img691.imageshack.us/img691/7153/vertalign.gif

2

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

3

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)

4

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

[HTML]

umfliessender Text

rechter Text

[/HTML]
5

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="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>
6

Hallo.

Du hast

Beschreibung…

vergessen.
Liess dir nochmal Gilles Beispiel in aller Ruhe durch.

Gruss
Elroy