Welcome to WebmasterWorld Guest from 54.145.44.134

Forum Moderators: not2easy

Message Too Old, No Replies

background image in table cell won't align vertically

is it possible to align a background?

     

Lorel

6:38 pm on Feb 10, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I'm trying to set up code so the owner can occasionally change an image next to the logo which appears on all pages. I intend for him to just have to save the image in a set width with the same name and upload it. I'm doing this so it won't involve his having to change the code or my having to get a new copy of the code after he's done.

I set up a class in CSS called "swapimage" set as a background with no repeat. Then I applied that to one of two table cells. the cell in question is wider and higher than the image so there is plenty of room for it to move around. That cell is set to align center and valign middle. However the image , being a background, aligns to the top left and I wanted it centered vertically (I don't care about align center).

I have tried everything (vertical-align middle, padding, line height, absolute and relative positioning aplied to the background in CSS) and also setting up a div in that cell and put the class there and nothing works to get it away from the top (setting cellpadding on the whole table doesn't work either).

The code validates and also the CSS.

Here is the CSS without the added changes:

.swapimage {
background-image: url(images/swapimage.jpg);
background-repeat: no-repeat; }

Here is the table layout:

<table align="center" width="760" border="0" cellpadding="0" cellspacing="0" bgcolor="#000000">
<tr><td width="500" align="center">
<img src="images/logo1.gif" width="400" height="146" alt="logo">
</td><td width="260" align="center" valign="middle" class="swapimage">
</td></tr></table>

Am I trying to do the impossible or is there something I'm missing?

Span

7:09 pm on Feb 10, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



You have to center background images with background-position [meyerweb.com]

background-position:center;

Lorel

8:42 pm on Feb 10, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Thanks much!

I was reading instructions for images and not background.

So simple!

 

Featured Threads

Hot Threads This Week

Hot Threads This Month