aligning text to image

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

tomasio - 27 Feb 2006 13:33 GMT

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

Reply to this Message

Arne - 27 Feb 2006 14:17 GMT

> Dear NG-readers,
>
[quoted text clipped - 10 lines]
>
> 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>

Signature

/Arne

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

Reply to this Message

tomasio - 27 Feb 2006 15:02 GMT

>> Dear NG-readers,
>>
[quoted text clipped - 21 lines]
>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

Reply to this Message

Spartanicus - 27 Feb 2006 15:33 GMT

>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
[quoted text clipped - 4 lines]
>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

Signature

Spartanicus

Reply to this Message

tomasio - 27 Feb 2006 17:19 GMT

>>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
[quoted text clipped - 9 lines]
>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

Reply to this Message

Sid Ismail - 27 Feb 2006 16:08 GMT

: Dear NG-readers,
:
[quoted text clipped - 8 lines]
:
: 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

Reply to this Message

tomasio - 27 Feb 2006 17:21 GMT

>If it were me, I would use tables. Of course I use CSS as well, but
>for this application, what could be simpler?
[quoted text clipped - 9 lines]
>
>Sid

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

Thank you for your help.

kind regards,
--
tomasio

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / February 2006

aligning text to image