Image not filling a table table (html4 strict) - Page 2

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View

Re: Image not filling a table table (html4 strict)

dorayme wrote:
Quoted text here. Click to load it

I don't understand how "stretch to fit" relates in this problem. Gap, yes.

<snipped section leading to the example below>

Quoted text here. Click to load it

The OP only asked about an image within a cell. There was no mention of
any text associated, least of all its quantity. Your first example
killy.html  used  display:block;  to remove the white space below the
image. On my screen, the text in the first cell is on one line (one line
of text). I simply mentioned that  vertical-align:bottom;  will also do
the job. You then talked much about descender and I wondered why since
it should be understood that both  display:block;  and
vertical-align:bottom;  bring the image from its baseline down to the
bottom. (On reducing the window size, the text is expanded to several
lines and the image is centered and off the bottom of the cell -
applying  vertical-align:bottom;  to the cell resolves this).

You presented  killy_gus3.html  with three cells and plenty of text
spanning several lines. You've expanded the problem with the multiple
text lines in the first two cells and resolved it by applying
vertical-align:bottom;  also to the image's cell.

So, I was talking about  .img img  "only" and you were talking about
td.img  "as well" am I correct?

.img img  takes  vertical-align:bottom;

td.img  may take either  display:block;  or  vertical-align:bottom;
This is all that I was saying.

Quoted text here. Click to load it

My sincerest apologies, madam.


Re: Image not filling a table table (html4 strict)

Quoted text here. Click to load it

Since the thread veered into this other matter, I was just making sure
we were on the same wave length, that's all. I am saying what you are
saying, that the stretch to fit problem has nothing to do with this one,
so let's concentrate on this one. And just as a reminder to the possibly
three other people on this planet who might read this now or in the

Quoted text here. Click to load it

In general, in these matters about cells, what is in adjoining cells is
quite important because these other cells are a major determinate of the
size of the cell which we might be focussing on. But in this particular
case of the URL you quote I was exampling the application of
vertical-align to the image itself as distinguished from its application
to the cell itself. At least in its effect practically in the browsers I
have. In this latter capacity it acts on text too.

Perhaps I should have given further URLS to the code I typed up in the
post that demonstrates the difference. I was hoping you would not need
me to do that but I will if you are still not quite gathering my meaning.

Perhaps you missed the significance of my "does not get the image on the
bottom in FF or Safari or Opera." in my last post? Your suggestion to
remove display:block; earlier and replace with vertical:align; is
slightly ambiguous. But taken literally, it does not work in all good
modern browsers. Nor does it work when not taken literally - namely to
remove display: block; and put vertical:align; on the cell itself rather
the image element. Not on my tests.

But, all not being lost, putting your vertical-align on both elements
did the trick. At least it seemed to.

Is that not an interesting matter Gus. We should be cracking out the

(I think display: block on the image is by far the simplest thing to do
to get rid of the cause of the gap in this matter of inline image. It
attacks the problem at the joint of its reality without entering the
kingdom of worms - to adapt (in my flowery way) - your expression. <g>)


Re: Image not filling a table table (html4 strict)

In article

Quoted text here. Click to load it

are a major determinant


Re: Image not filling a table table (html4 strict)

On 2008-08-11, killy971 wrote:
Quoted text here. Click to load it

   Have you tried: td img { display: block; } ?

   Chris F.A. Johnson, webmaster         <
   Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)

Re: Image not filling a table table (html4 strict)

Quoted text here. Click to load it


A real easy way to fix your problem is just to ensure that there are no line
breaks between the <td> and the </td>.

With issue...

<img src="../images/image.gif">

Without issue...

<td><img src="../images/image.gif"></td>

Hope this helps


Site Timeline