aligning text to image

[tomasio]

Dear NG-readers,

I want to align text right to an image. The last line of text should
align with the bottom edge of the image. Unfortunately, the results
using my poor CSS knowledge mounted in text which starts at the bottom
line of the image and continues below. For an example go here:
http://tomasio.at/temp/test_valign.html

I want to achieve the following look:
http://tomasio.at/temp/correct.html

Does anybody could give me a hint what I am doing wrong?

kind regards,
--
tomasio

[Arne]

Once upon a time *tomasio* wrote:

Dear NG-readers,

I want to align text right to an image. The last line of text should
align with the bottom edge of the image. Unfortunately, the results
using my poor CSS knowledge mounted in text which starts at the bottom
line of the image and continues below. For an example go here:
http://tomasio.at/temp/test_valign.html

I want to achieve the following look:
http://tomasio.at/temp/correct.html

Does anybody could give me a hint what I am doing wrong?

kind regards,

Something like this may work?

<div class="indent"> <img src="images/jan_bild.jpg"
style="float: left; margin-right: 10px;" alt="image" height="150"
width="145">
<p style="margin-top: 60px;">this text
should float the image on theleft side, but the last line of text
should end with the bottom line of
the image.</p>
</div>

--
/Arne

Now ignoring all top posters
* How to post: http://www.cs.tut.fi/~jkorpela/usenet/brox.html
-------------------------------------------------------------

[tomasio]

On Mon, 27 Feb 2006 15:17:20 +0100, Arne <in*****@domain.invalid>
wrote:

Once upon a time *tomasio* wrote:

Dear NG-readers,

I want to align text right to an image. The last line of text should
align with the bottom edge of the image. Unfortunately, the results
using my poor CSS knowledge mounted in text which starts at the bottom
line of the image and continues below. For an example go here:
http://tomasio.at/temp/test_valign.html

I want to achieve the following look:
http://tomasio.at/temp/correct.html

Does anybody could give me a hint what I am doing wrong?

kind regards,

Something like this may work?

<div class="indent"> <img src="images/jan_bild.jpg"
style="float: left; margin-right: 10px;" alt="image" height="150"
width="145">
<p style="margin-top: 60px;">this text
should float the image on theleft side, but the last line of text
should end with the bottom line of
the image.</p>
</div>

Thanks a lot, Arne, that is a step towards the solution of the desired
layout. The problem is, as soon as the text is changing in its size,
the alignment is not correct any more. Is there a possibility to keep
the text to the bottom edge of the image no matter what amount of text
I enter?

kind regards,
--
tomasio

[Spartanicus]

tomasio <fr*********@bled.de> wrote:

I want to align text right to an image. The last line of text should
align with the bottom edge of the image. Unfortunately, the results
using my poor CSS knowledge mounted in text which starts at the bottom
line of the image and continues below. For an example go here:
http://tomasio.at/temp/test_valign.html

I want to achieve the following look:
http://tomasio.at/temp/correct.html

<title>CSS Tutorial</title>?

Doing this "properly" requires browser support for CSS tables (not
supported by IE): http://homepage.ntlworld.ie/spartanicus/temp.htm

--
Spartanicus

[Sid Ismail]

On Mon, 27 Feb 2006 14:33:06 +0100, tomasio <fr*********@bled.de>
wrote:

: Dear NG-readers,
:
: I want to align text right to an image. The last line of text should
: align with the bottom edge of the image. Unfortunately, the results
: using my poor CSS knowledge mounted in text which starts at the bottom
: line of the image and continues below. For an example go here:
: http://tomasio.at/temp/test_valign.html
:
: I want to achieve the following look:
: http://tomasio.at/temp/correct.html
:
: Does anybody could give me a hint what I am doing wrong?
If it were me, I would use tables. Of course I use CSS as well, but
for this application, what could be simpler?

<table cellpadding=6>
<tr>
<td>the image</td>
<td valign=bottom>the text</td>
</tr>
</table>

Set width of TDs and Table to taste. Serves a good page.

Sid

[tomasio]

On Mon, 27 Feb 2006 15:33:06 GMT, Spartanicus
<in*****@invalid.invalid> wrote:

tomasio <fr*********@bled.de> wrote:

I want to align text right to an image. The last line of text should
align with the bottom edge of the image. Unfortunately, the results
using my poor CSS knowledge mounted in text which starts at the bottom
line of the image and continues below. For an example go here:
http://tomasio.at/temp/test_valign.html

I want to achieve the following look:
http://tomasio.at/temp/correct.html

<title>CSS Tutorial</title>?

Doing this "properly" requires browser support for CSS tables (not
supported by IE): http://homepage.ntlworld.ie/spartanicus/temp.htm

thx a lot, Spartacus. It's a shame that IE does not render CSS tables,
but at least it displays correctly in Firefox.

kind regards,
--
tomasio

[tomasio]

On Mon, 27 Feb 2006 18:08:29 +0200, Sid Ismail <el***@nospam.co.za>
wrote:

If it were me, I would use tables. Of course I use CSS as well, but
for this application, what could be simpler?

<table cellpadding=6>
<tr>
<td>the image</td>
<td valign=bottom>the text</td>
</tr>
</table>

Set width of TDs and Table to taste. Serves a good page.

Sid

In this case it is the most simple approach. Sometimes these tables
are still useful ; )

Thank you for your help.

kind regards,
--
tomasio