«

Hi,

I use xhtml and I need to create a simple table which consists of 2
columns and 1 row. The firs column of the table will contain some text
and the second one an image. The width of the both columns is fixed
and the height of the row is defined by the amount of the text in the
first column. I would like my image adjusts the hight of the row (i.e.
automatically stretches if it is needed).

Is that possible to do within xhtml? I now that I can set the height
of the image explicitly. I need to do something like height=100%. But
it seems to be not supported in xhtml.

Thank you in advance.

I found something that looks like what i need:
<img src="img/l.jpg" style="width: 100%; height: 100%" alt="" /></td>

However, it does not work. Why? I do explicitly say that the image
should take the 100% of the height and it does not take. You can see
how it looks like here:
http://www.showandbeshown.com/headtail.php

<> wrote in message
news:80dec378-5cf8-4b3b-87ab-...
>I found something that looks like what i need:
> <img src="img/l.jpg" style="width: 100%; height: 100%" alt="" /></td>

> However, it does not work. Why? I do explicitly say that the image
> should take the 100% of the height and it does not take. You can see
> how it looks like here:
> http://www.showandbeshown.com/headtail.php

You should be using l.jpg as a background for that cell. It wall
automatically repeat and fill up the cell.

--
Richard.

On Dec 5, 9:20 pm, "rf" <r...@invalid.com> wrote:
> <showandbesh...@gmail.com> wrote in message
>
> news:80dec378-5cf8-4b3b-87ab-...
>
> >I found something that looks like what i need:
> > <img src="img/l.jpg" style="width: 100%; height: 100%" alt="" /></td>
> > However, it does not work. Why? I do explicitly say that the image
> > should take the 100% of the height and it does not take. You can see
> > how it looks like here:
> >http://www.showandbeshown.com/headtail.php
>
> You should be using l.jpg as a background for that cell. It wall
> automatically repeat and fill up the cell.
>
> --
> Richard.

If I use <td background="image.jpg">, it helps only but only
partially. Because, it looks like I want, but the document becomes
"not valid xhtml document" since "there is not background attribute
for the <td> element".

<> wrote in message
news:588b2edb-3ad5-4968-961c-...
> On Dec 5, 9:20 pm, "rf" <r...@invalid.com> wrote:
>> <showandbesh...@gmail.com> wrote in message
>>
>> news:80dec378-5cf8-4b3b-87ab-...
>>
>> >I found something that looks like what i need:
>> > <img src="img/l.jpg" style="width: 100%; height: 100%" alt="" /></td>
>> > However, it does not work. Why? I do explicitly say that the image
>> > should take the 100% of the height and it does not take. You can see
>> > how it looks like here:
>> >http://www.showandbeshown.com/headtail.php
>>
>> You should be using l.jpg as a background for that cell. It wall
>> automatically repeat and fill up the cell.
>>
>> --
>> Richard.
>
> If I use <td background="image.jpg">, it helps only but only
> partially. Because, it looks like I want, but the document becomes
> "not valid xhtml document" since "there is not background attribute
> for the <td> element".

Then specify it using CSS.

XHTML is not viable on the web anyway. IE simply does not understand it and
you are serving it up as as text/html so browsers are error correcting it
back to HTML anyway.

HTML 4.01 strict is the way to go.

--
Richard.

In article
<de8f9391-398d-487e-a69d-
m>,
wrote:

> Hi,
>
> I use xhtml and I need to create a simple table which consists of 2
> columns and 1 row. The firs column of the table will contain some text
> and the second one an image. The width of the both columns is fixed
> and the height of the row is defined by the amount of the text in the
> first column. I would like my image adjusts the hight of the row (i.e.
> automatically stretches if it is needed).
>
> Is that possible to do within xhtml? I now that I can set the height
> of the image explicitly. I need to do something like height=100%. But
> it seems to be not supported in xhtml.
>
> Thank you in advance.

Amazingly:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
<title>Fit to cell</title>
<style type="text/css">
* {margin: 0; padding: 0;}

img {
display: block;
width: 10em;
height: 100%;
}

td {
width: 10em;
padding: 0;
border: 0px solid #000;
}

table {border-collapse: collapse;}
</style>
</head>
<body>

<table cellspacing="0"><tbody><tr>
<td>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Pellentesque augue.Lorem ipsum dolorLorem ipsum dolor sit amet,
consectetuer adipiscing elit. Pellentesque augue.Lorem ipsum
dolorLorem ipsum dolor sit amet, consectetuer adipiscing elit.
Pellentesque augue.Lorem ipsum dolor </td>
<td><img src="stretch.jpg" alt="" /></td>
</tr></tbody></table>

</body>
</html>

works, or at least gives the illusion, only in Safari 2.0.4 on a
Mac.

I think you will really require scripting for the img to reliably
get the height of the left cell depending on the user font size
etc...

--
dorayme

wrote:
> On Dec 5, 9:20 pm, "rf" <r...@invalid.com> wrote:
>> <showandbesh...@gmail.com> wrote in message
>>
>> news:80dec378-5cf8-4b3b-87ab-...
>>
>>> I found something that looks like what i need:
>>> <img src="img/l.jpg" style="width: 100%; height: 100%" alt="" /></td>
>>> However, it does not work. Why? I do explicitly say that the image
>>> should take the 100% of the height and it does not take. You can see
>>> how it looks like here:
>>> http://www.showandbeshown.com/headtail.php
>> You should be using l.jpg as a background for that cell. It wall
>> automatically repeat and fill up the cell.
>>
>> --
>> Richard.
>
> If I use <td background="image.jpg">, it helps only but only
> partially. Because, it looks like I want, but the document becomes
> "not valid xhtml document" since "there is not background attribute
> for the <td> element".

I'm guessing you want a fluid rounded corner box with transparent corners?

If so, you could do it this way:

http://www.lester1.eclipse.co.uk/1/

It's ugly, but not as ugly as your table version.

This uses a variation of the "sliding doors" technique, which basically
uses a very wide corner image to span the entire width of the box and
"slide out" when the box expands. Transparency causes quite a few issues
with sliding doors, which is usually done using nested divs. That's why
I had to resort to empty divs.

There might be a more elegant way of doing this with transparent corners
but I can't think of one.