Bild-Ausrichtung, CSS und keiner mag mich

Computer: Software & Programmierung HTML & CSS
#1

Hai, Leute,

ich steh irgendwie völlig auf der Leitung und krieg es einfach nicht hin…
Ich hab da mehrere Seiten mit unterschiedlich viel Text in mehreren Absätzen und jeweils ein Bild. Das Bild soll immer an der Unterkante des Textes ausgerichtet sein und, natürlich, daneben stehen.

Mit Tabellen war das kein Problem: zwei Zellen nebeneinander, Textausrichtung bottom und die Sache passt…

…nun sind Tabellen als Layouthilfe aber bahbah und ich quäl mich nun damit rum, das Bild-div irgendwie auf die gleiche Größe zu bekommen, wie das jeweilige Text-div - aber es geht nicht *jammer*

Feste Höhe angeben geht nicht, da ja der Text unterschiedlich lang ist…

Inzwischen hab ich mich völlig festgefressen und komm nicht weiter - kann mir irgendjemand auf die Sprünge helfen?

Gruß
Sibylle

#2

hm…

es sollte doch möglich sein, dass Du 3 divs erstellst…

in etwa so:

---------------------------------
||--------||-------------------||
|| || ||
|| BILD || ||
|| || ||
|| || ||
||\_\_\_\_\_\_\_\_||\_\_\_\_\_\_TEXT\_\_\_\_\_\_\_\_\_|| 
|\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_|

evtl wäre auch noch das mit dem floating-text was für Dich…
http://www.westciv.com/style_master/house/tutorials/…

#3

Hallo,

es geht mit JavaScript, wenn du nach dem Laden div2.heigth = div1.heigth setzt. Musst nur beim IE aufpassen, dass er schon fertig geladen hast bevor du das aufrufst, z.B. so:

if (document.body && document.body.offsetWidth) {
 window.onresize = MachGroesseGleich;

}

Ciao! Bjoern

#4

Hallo Sibylle!

„Sibylle“ schrieb:

Ich hab da mehrere Seiten mit unterschiedlich viel Text in
mehreren Absätzen und jeweils ein Bild. Das Bild soll immer an
der Unterkante des Textes ausgerichtet sein und, natürlich,
daneben stehen.

Mit Tabellen war das kein Problem: zwei Zellen nebeneinander,
Textausrichtung bottom und die Sache passt…

…nun sind Tabellen als Layouthilfe aber bahbah und ich quäl
mich nun damit rum, das Bild-div irgendwie auf die gleiche
Größe zu bekommen, wie das jeweilige Text-div - aber es geht
nicht *jammer*

Feste Höhe angeben geht nicht, da ja der Text unterschiedlich
lang ist…

Inzwischen hab ich mich völlig festgefressen und komm nicht
weiter - kann mir irgendjemand auf die Sprünge helfen?

Vielleicht hilft Dir:
http://www.mediaevent.de/article.php/20040926103515715
Die vergessene Bildunterschift

Gruss Oliver

#5

Hai, MunichFreak,

||--------||-------------------||
|| || ||
|| BILD || ||
|| || ||
|| || ||
||________||______TEXT_________||
|_______________________________|

hab ich ja - dem „Außen-rum-div“ die Eigenschaft vertical-align:bottom verpasst und erwartet, daß ein Bild, daß nur halb so hoch ist, wie der Text, an der Unterkante mit dem Text abschließt und die Lücke oben ist - tut’s aber nicht…

evtl wäre auch noch das mit dem floating-text was für Dich…
http://www.westciv.com/style_master/house/tutorials/…

Wird schon benutzt, um Bild und Text nebeneinander zu haben.

Noch Ideen?

Gruß
Sibylle

#6

Hai, Björn,

es geht mit JavaScript, wenn du nach dem Laden div2.heigth =
div1.heigth setzt. Musst nur beim IE aufpassen, dass er schon

JavaScript wäre natürlich auch 'ne Idee - möchte ich aber möglichst vermeiden…

Danke
Gruß
Sibylle

#7

Hai, Oliver,

Vielleicht hilft Dir:
http://www.mediaevent.de/article.php/20040926103515715
Die vergessene Bildunterschift

nee, leider nicht wirklich. Das ergibt nur eine getrickste Version dessen, was ich schon habe: Bild und Text stehen brav nebeneinander, aber das Bild rutscht nicht nach unten, wenn der Text länger ist (die Lücke soll oben sein)

trotzdem Danke
Sibylle