table td padding

[Eustace]

Can somebody explain to me why in the webpage

https://files.nyu.edu/emf202/public/temp/polytima.html

the padding below the images is bigger than at top? I have specified

table table td {
...
padding: 10px;
...
}

For the padding-bottom to look like the other 3

table table td: padding 10px 10px 5px 10px;

for the padding-bottom to look like the other 3 sides. Why?

emf

 

[dorayme]

Can somebody explain to me why in the webpage

https://files.nyu.edu/emf202/public/temp/polytima.html

the padding below the images is bigger than at top?

Are you sure it is padding? With images, unless you set them to display
as block, they are treated like big letters on a line and like letters
on a line, space is reserved for descenders.

<http://dorayme.netweaver.com.au/alt/inlinePicWithDescenderSpace.html>

er... this tables within tables, no... maybe never mind for the
moment... <g>

 

[dorayme]

....

....

Have a look at how NCS734 can be done without an extra table within a
table, your mark up will be cleaner with such a tidy up. I left your
markup largely untouched for the other two cells in the row I am
showing...

<http://dorayme.netweaver.com.au/alt/imagesInTable.html>

Adjust paddings etc to suit.

 

[Andy]

Can somebody explain to me why in the webpage

https://files.nyu.edu/emf202/public/temp/polytima.html

the padding below the images is bigger than at top? I have specified

table table td {
...
padding: 10px;
...
}

For the padding-bottom to look like the other 3

table table td: padding 10px 10px 5px 10px;

for the padding-bottom to look like the other 3 sides. Why?

emf

Hi Eustace,

A lot of people think that it's because images are treated like inline
characters and therefore need the extra space underneath for descenders. The
truth is that it's not the images but line breaks or spaces within the <td>
that are causing the issue.

Here's a snippet of your code...

<table>
<tr>
<td>
<img src="NCS730.JPG" width="253" height="168" alt="">
</td>
</tr>
</table>

You can see that your <td> definitely includes two line breaks. Now try this
instead...

<table>
<tr>
<td><img src="NCS730.JPG" width="253" height="168" alt=""></td>
</tr>
</table>

.... and you will see that your issue is resolved.


Hope this helps


Andy

 

[Travis Newbury]

Can somebody explain to me why in the webpage

My question is why do you put those dumb W3C button/icon things at the
bottom of your (rather bland) page? You do realize that virtually
none of your customers know of, or care about, the W3C at all. The
only people that might even care are located right here in this group,
and I doubt a single one of them has purchased anything from your
site.

Lose the W3C icons they (the images, not the actions you did to make
your page compliant) do not add to your site at all.

 

[dorayme]

....
A lot of people think

Do they now? Well what did the many-in-one actually say? <g>

"Are you sure it is padding? With images, unless you set them to display
as block, they are treated like ..."

that it's because images are treated like inline
characters and therefore need the extra space underneath for descenders. The
truth is that it's not the images but line breaks or spaces within the <td>
that are causing the issue.

Here's a snippet of your code...

<table>
<tr>
<td>
<img src="NCS730.JPG" width="253" height="168" alt="">
</td>
</tr>
</table>

You can see that your <td> definitely includes two line breaks.

Not from the usenet post I'm reading. Anyway, you are right that there
can be issues with some browsers from the formatting in this regard, IE
mainly. But I am not sure this is the case here. Look at this one in
Firefox:

http://dorayme.890m.com/alt/markupFormatting.html

Now try this
instead...

Post a URL if you want to show something like this and mention the
browsers you are testing, it could be instructive.

 

[rf]

Lose the W3C icons they (the images, not the actions you did to make
your page compliant) do not add to your site at all.

And the very first thing most of us here to when confronted with those
buttons is to click on them. These are broken.

When I go to the trouble to fire up the validator manually it reports HTML
errors. Not a good sign

 

[Eustace]

...

Have a look at how NCS734 can be done without an extra table within a
table, your mark up will be cleaner with such a tidy up. I left your
markup largely untouched for the other two cells in the row I am
showing...

<http://dorayme.netweaver.com.au/alt/imagesInTable.html>

Adjust paddings etc to suit.

Just when I thought I had finished with it!... Your solution certainly
simplifies greatly the code. However, when I tried to implement it, I
got a problem with the vertical images:

https://files.nyu.edu/emf202/public/temp/polytima2.html

I suspect it's something simple to fix, but I can't think how right now.

emf

 

[Eustace]

My question is why do you put those dumb W3C button/icon things at the
bottom of your (rather bland) page? You do realize that virtually
none of your customers know of, or care about, the W3C at all. The
only people that might even care are located right here in this group,
and I doubt a single one of them has purchased anything from your
site.

Lose the W3C icons they (the images, not the actions you did to make
your page compliant) do not add to your site at all.

My answer is that basically I put them there as a reward to myself for a
hard day of code fixing - in place in a way of the webmaster's
signature. They are something like the final touch.

Anyway, they are there tentatively and I imagine that in all probability
Polytima won't like them and they'll be taken out. As for the links that
rf mentioned, I've been thinking for a while to take them off and leave
the images without them.

emf

 

[Adrienne Boswell]

My answer is that basically I put them there as a reward to myself for

a

hard day of code fixing - in place in a way of the webmaster's
signature. They are something like the final touch.

It's not a reward system. It's a tool to validate your markup against
standards. Travis is right, they really serve no purpose - especially
if what they are proclaiming is not true.

Anyway, they are there tentatively and I imagine that in all probability
Polytima won't like them and they'll be taken out. As for the links that
rf mentioned, I've been thinking for a while to take them off and leave
the images without them.

Then you would be lying, and I can still use my browser to check the
validity of your page(s).

By the way, the jewelry is gorgeous.

 

[Eustace]

a

It's not a reward system. It's a tool to validate your markup against
standards. Travis is right, they really serve no purpose - especially
if what they are proclaiming is not true.

*I only add them after I have validated a page!* And I don't use them to
go to the validation pages, for this I use a bookmarks. Up until rather
recently my pages contained some invalid code or did not follow the html
4.1 strict, and did not have the W3C images. When I was in geocities I
had a problem since my code was OK, but Yahoo's code was not. BTW, using
the links to validate the page would be a good idea, but I do not think
it works when I validate pages while they are on my hard drive, where I
have to work on them before uploading them to the server.

Then you would be lying, and I can still use my browser to check the
validity of your page(s).

You repeat again that I am or would be lying. I repeat again: I ADD THE
IMAGES ONLY *AFTER* A VALIDATE A PAGE! If it ever happens otherwise
(after, say, making a small change and then forgetting to revalidate the
page), it is due to a mistake and will be corrected as soon as it comes
to my attention.

IMO, the issue is those pages that are not valid out there. If more
webpages were validated *and* contained the images to remind everybody
visiting them that it's worthwhile for webpages to be valid, hopefully
at some point all web programmers would feel the obligation to conform
to the standards. I would love to see more pages containing those W3C
images!

By the way, the jewelry is gorgeous.

I will transfer the compliment.

emf

 

[dorayme]

...

Have a look at how NCS734 can be done without an extra table within a
table, your mark up will be cleaner with such a tidy up. I left your
markup largely untouched for the other two cells in the row I am
showing...

<http://dorayme.netweaver.com.au/alt/imagesInTable.html>

Adjust paddings etc to suit.

Just when I thought I had finished with it!... Your solution certainly
simplifies greatly the code. However, when I tried to implement it, I
got a problem with the vertical images:

https://files.nyu.edu/emf202/public/temp/polytima2.html

I suspect it's something simple to fix, but I can't think how right now.
[/QUOTE]

More than likely. Try validating your mark up, there are a few errors.
Easy to happen when you are making changes and have been staring at it
for a while!

But now you know why it is risky sticking in those validation approval
buttons! About those buttons, I would never use them because I might
want to allow a page to be strictly invalid according to them, it is a
matter of pride you see. By *not* sticking in such things, you are
saying "Hey listen, God, I am an independent being and I may want to be
bad some day, I may want to be less than perfect where it causes no harm
without running to you for approval like a rabbit *each time*. I want to
consult you Dear Lord from time to time, but I don't want you on my f
back"

I see no problem visually anyway? Anyway, here is the adaptation I made
but with all three images so treated as before:

<http://dorayme.netweaver.com.au/alt/imagesInTable2.html>

Look at the whole doc.

 

[Eustace]

More than likely. Try validating your mark up, there are a few errors.
Easy to happen when you are making changes and have been staring at it
for a while!

No. No problems with validation.

But now you know why it is risky sticking in those validation approval
buttons! About those buttons, I would never use them because I might
want to allow a page to be strictly invalid according to them, it is a
matter of pride you see. By *not* sticking in such things, you are
saying "Hey listen, God, I am an independent being and I may want to be
bad some day, I may want to be less than perfect where it causes no harm
without running to you for approval like a rabbit *each time*. I want to
consult you Dear Lord from time to time, but I don't want you on my f
back"

Well I, being an amateur, do not care to check my webpages with
different browsers or versions, I compose them in Firefox and
occasionally check them with IE. And, except for this particular webpage
that I made for a friend, they are not commercial. By having them
validated, if something goes wrong I know it's not my fault, and, except
for this particular one, do not care too much about it anyway. But
thanks for you comment. I had myself sensed that those who criticized me
about the W3C logos in all probability do not validate their webpages in
the first place. BTW, until recently some of the pages I had made 10
years ago were not valid and/or followed the html transitional standards
- and certainly did not contained the W3C logo.

I see no problem visually anyway?

You don't see any problem? Look at the original file (with tables within
table):

https://files.nyu.edu/emf202/public/temp/polytima.html

This is how I want the page to look like. Now look at

https://files.nyu.edu/emf202/public/temp/polytima2.html

and

https://files.nyu.edu/emf202/public/temp/polytima3.html

politima3 is with your code with the change of "test" to "jewel". In
politima2 I have corrected the centering of the long images. The problem
with both 2 and 3 is that the right and left margins in the long
(portrait) images are not as they should be; they are covering all the
available width of the column.

Anyway, here is the adaptation I made

but with all three images so treated as before:

<http://dorayme.netweaver.com.au/alt/imagesInTable2.html>

Look at the whole doc.

If you included the second row you would see what I mean.

emf

 

[Beauregard T. Shagnasty]

I had myself sensed that those who criticized me about the W3C logos
in all probability do not validate their webpages in the first place.

I doubt if that would be true. I validate all my pages.

A long time ago when I discovered the W3C validation, I too put the logo
images on my pages. "Cool!," I said to myself. Then one of my clients
said, "What are these things? They look silly." And I realized she was
right.

 

[Adrienne Boswell]

As for the links

You repeat again that I am or would be lying. I repeat again: I ADD THE
IMAGES ONLY *AFTER* A VALIDATE A PAGE! If it ever happens otherwise
(after, say, making a small change and then forgetting to revalidate the
page), it is due to a mistake and will be corrected as soon as it comes
to my attention.

RF mentioned that the markup was invalid. You said that you would
remove the links and keep the images. That would be lying.

IMO, the issue is those pages that are not valid out there. If more
webpages were validated *and* contained the images to remind everybody
visiting them that it's worthwhile for webpages to be valid, hopefully
at some point all web programmers would feel the obligation to conform
to the standards. I would love to see more pages containing those W3C
images!

I think the real issue here is that you posted a URL that did not have
valid markup and did have validation icons. It's rather like inviting
your new neighbors over for dinner, and when they get there the house is
a mess.

 

[Eustace]

RF mentioned that the markup was invalid. You said that you would
remove the links and keep the images. That would be lying.


I think the real issue here is that you posted a URL that did not have
valid markup and did have validation icons. It's rather like inemviting
your new neighbors over for dinner, and when they get there the house is
a mess.

SO BE IT!

emf

 

[dorayme]

No. No problems with validation.

Well, when I looked very early this morning, before I had to rush, I got
invalid and some error warnings? So I assumed some temporary mistake
that was causing your problem ... I am now looking at polytima2.html
again and this time it is it is reporting valid with one warning about
byte order.

Well I, being an amateur, do not care to check my webpages with
different browsers or versions, ...

Perhaps there are things that can go a bit wrong when one checks the
validator. It is not a protected procedure like the one the pope uses to
check with God if he has the correct view about something. Perhaps
something went wrong at my end or some other thing not your fault. I do
recall clearly seeing the BOM warning before and it is still there.

You don't see any problem?

....

Yes, I see the problem now! Interesting. The reason it shows up (I slap
my forehead, OK?) with multirows is that the table naturally has a mind
of its own and widths the cells to line up row by row. Since you have
portraits and landscapes mixed, the cells that are landscape will widen
the ones vertically adjacent to suit. You are using the cells for
framing effects and so this is certainly not what you would want. Sorry
I missed this.

What to do? Here are the options as I see them:

1. Rearrange the images so the vertical ones are above and under the
vertical ones, landscapes too. Size them in standards, that is, keep the
same width for the landscapes and another for all the portraits.

2. Have one row tables only! One below the other. Perhaps you will feel
that this is not better than tables within tables. But I think it better.

3. Get the effect you want by having an inner within an outer div for
the framing, both in generous fixed size cells.

4. Do away with tables altogether. You might use a div box within a div
box to get the effect you want and float all the outer divs along the
lines of:

<http://netweaver.com.au/alt/thumbnailGalleryWithShortCaptions/thumbLands
capeGallery7.html>

You would need to adapt. If you are interested, and need pointers (after
trying), ask me.

There are other options too but not well supported by

politima3 is with your code with the change of "test" to "jewel".

Just btw, the reason I used a class was to target my example
non-table-within-table construction with CSS, I had supposed it would be
unneeded if all the table-within-table constructions were dispensed
with. You can target all the images and divs with:

table img {...}
table div {...}

I might return to this.

 

[Eustace]

Well, when I looked very early this morning, before I had to rush, I got
invalid and some error warnings? So I assumed some temporary mistake
that was causing your problem ... I am now looking at polytima2.html
again and this time it is it is reporting valid with one warning about
byte order.


Perhaps there are things that can go a bit wrong when one checks the
validator. It is not a protected procedure like the one the pope uses to
check with God if he has the correct view about something. Perhaps
something went wrong at my end or some other thing not your fault. I do
recall clearly seeing the BOM warning before and it is still there.


...

Yes, I see the problem now! Interesting. The reason it shows up (I slap
my forehead, OK?) with multirows is that the table naturally has a mind
of its own and widths the cells to line up row by row. Since you have
portraits and landscapes mixed, the cells that are landscape will widen
the ones vertically adjacent to suit. You are using the cells for
framing effects and so this is certainly not what you would want. Sorry
I missed this.

What to do? Here are the options as I see them:

1. Rearrange the images so the vertical ones are above and under the
vertical ones, landscapes too. Size them in standards, that is, keep the
same width for the landscapes and another for all the portraits.

2. Have one row tables only! One below the other. Perhaps you will feel
that this is not better than tables within tables. But I think it better.

3. Get the effect you want by having an inner within an outer div for
the framing, both in generous fixed size cells.

4. Do away with tables altogether. You might use a div box within a div
box to get the effect you want and float all the outer divs along the
lines of:

<http://netweaver.com.au/alt/thumbnailGalleryWithShortCaptions/thumbLands
capeGallery7.html>

You would need to adapt. If you are interested, and need pointers (after
trying), ask me.

There are other options too but not well supported by


Just btw, the reason I used a class was to target my example
non-table-within-table construction with CSS, I had supposed it would be
unneeded if all the table-within-table constructions were dispensed
with. You can target all the images and divs with:

table img {...}
table div {...}

Great idea.

I might return to this.

So far as I see it I basically have 2 options:

(1) https://files.nyu.edu/emf202/public/temp/polytima.html

The original one, with tables within tables.

(2) https://files.nyu.edu/emf202/public/temp/polytima2.html (*revised*)

This has a less elaborate visual effect, its code, however, is much
simplified by eliminating <div> altogether. One could argue that the
lesser visual effect is counterbalanced with the simplicity of the code.
Polytima will have to decide on this. She had me make simpler the visual
effect of the first design that I presented her (with much wider borders
etc). Besides the side being her, she has studied art, so I don't argue
with her on aesthetic issues.

Unfortunately

(3) https://files.nyu.edu/emf202/public/temp/polytima3.html (revised)

which falls in between the other 2 as regards the complexity of the code
has this problem with the portrait images, but I haven't entirely given
up that some solution could be found.

I'll also have to explore your suggestions 2 and 4, but basically I am
more or less satisfied with the 2 options I already have developed.

Thanks,

emf

 

[Neredbojias]

I think the real issue here is that you posted a URL that did not
have valid markup and did have validation icons. It's rather like
inviting your new neighbors over for dinner, and when they get there
the house is a mess.

I don't see the connection.

(Besides that, my old neighbors would be totally mystified if I invited
them over for anything and the house wasn't a mess. We all have our
styles, ya know.)

 

[Adrienne Boswell]

Gazing into my crystal ball I observed Neredbojias

I don't see the connection.

I should have said:

You invite your new neat freak neighbors over for dinner and your house
is a mess.

(Besides that, my old neighbors would be totally mystified if I invited
them over for anything and the house wasn't a mess. We all have our
styles, ya know.)

I have a five year old (soon to be six), people come over all the time,
and they all know to tread carefully because of trains, planes and
automobiles happening to be directly in the path of where ever they want
to walk.