Table td with background image & link & image

[Jean-Louis Crouzet]

Hello,

I'm just trying to find a way to center vertically into a single table
cell one picture which has the same height as the cell.

This is for a dynamic menu thing I'm trying to finalize and this picture
is going to be an indicator that there is a submenu for that item/cell.

Each th/td have been CSSed has follow for now:

table
{
color: #ffffff;
border-collapse: collapse;
border-style: hidden;
border-width: 0;
border-spacing: 0;
text-align: left;
text-indent: 20px;
font-family: lucida console, courier new, monospace;
font-size: 12px ;
font-style: normal;
font-weight: normal;
border-color: transparent;
background-color: transparent;
vertical-align: middle;
}

th
{
behavior: url('../style/desk_IE_hover.htc');
background-image: url("../img/menu/drop_down_menu_20x20.gif");
background-repeat: no-repeat;
background-position: middle;
}

td
{
behavior: url('../style/desk_IE_hover.htc');
background-image: url("../img/menu/target_20x20.gif");
background-repeat: no-repeat;
background-position: middle;
}

Then the generated code (using actually php) is the following let say
for one menu column:
/...
document.writeln("<div id='MENU4' style='position:absolute; top:32px;
left:290px; visibility:hidden'>") ;
document.writeln("<table>") ;
document.writeln("<tr><td width=130 height=20 Set_Visibility4()'><a
href='lien_menu1.1.html#' onMouseOver='Set_Visibility4()'> Menu
1.1</a><img src='../img/menu/target_20x20.gif' width=20 height=20
align='middle'></td></tr>") ;
document.writeln("<tr><td width=130 height=20 Set_Visibility5()'><a
href='lien_menu1.2.html#' onMouseOver='Set_Visibility5()'> Menu
1.2</a><img src='../img/menu/target_20x20.gif' width=20 height=20
align='middle'></td></tr>") ;
document.writeln("<tr><td width=130 height=20 Set_Visibility6()'><a
href='lien_menu1.3.html#' onMouseOver='Set_Visibility6()'> Menu
1.3</a></td></tr>") ;
document.writeln("</table>") ;
document.writeln("</div>") ;
..../

Problem is that between the supposedly vertically centered <td>
background image and the image after my link which are identical, I
could not have them centered or even avoid any side effect within the
cell height.

I'm just looking for adivise (which still need to comply with
FireFox/Mozilla/IE...)?

Anticipated thanks,
JL

 

[Neredbojias]

With neither quill nor qualm, Jean-Louis Crouzet quothed

Hello,

I'm just trying to find a way to center vertically into a single table
cell one picture which has the same height as the cell.

Do you realize this makes no sense whatsoever?

Problem is that between the supposedly vertically centered <td>
background image and the image after my link which are identical, I
could not have them centered or even avoid any side effect within the
cell height.

If you're trying to match a background image with a content image, that
could be pretty hairy. Browsers aren't perfect (-the understatement of
the year.)

 

[Jean-Louis Crouzet]

With neither quill nor qualm, Jean-Louis Crouzet quothed




Do you realize this makes no sense whatsoever?




If you're trying to match a background image with a content image, that
could be pretty hairy. Browsers aren't perfect (-the understatement of
the year.)

Thanks for your comments, I realized that and I was just asking for some
help here. This is indeed what I'm trying to achieve for now I'm just a
pixel far from it, but I would like to get this fix.
Have a nice day,
JL

 

[Neredbojias]

With neither quill nor qualm, Jean-Louis Crouzet quothed:

Thanks for your comments, I realized that and I was just asking for some
help here. This is indeed what I'm trying to achieve for now I'm just a
pixel far from it, but I would like to get this fix.
Have a nice day,
JL

Sorry if I was girly. For what it's worth, I've had more luck
vertically-centering things using the transitional dtd mode and the vers
of IE that comes with XP seems to add 1 pixel of space between what
should otherwise be adjacent (horizontally) images.

 

[Jean-Louis Crouzet]

With neither quill nor qualm, Jean-Louis Crouzet quothed:




Sorry if I was girly. For what it's worth, I've had more luck
vertically-centering things using the transitional dtd mode and the vers
of IE that comes with XP seems to add 1 pixel of space between what
should otherwise be adjacent (horizontally) images.

No problemo, thanks for your further comment which definitely confirm
what I'm currently experimenting. Have a nice day.
JL