BG image properties but within a table cell (centre/untiled)

seanie morris · Joined: 02 Jun 2005 Posts: 49 Location: Offaly, Ireland

As an example, if you take a quick look at this post:

http://www.htmlcodetutorial.com/help/ftopic7404.html&highlight=background+image

it defines the properties for fixing a background image on a page (centered and unrepeating). Butwhat about from within a table cell, wishing to apply a background image, I won't be using CSS, will I? I have tried various tags (bgrepeat and bgposition and variations of) within the appropriate line:

<td width="508" height="582" valign="top" background="images/Dezynaweb_insignia_mediumhu.gif" bgcolor="#FFFFFF">

but I don't think I've got the right ones, or the right syntax perhaps.

Can anyone help me?

Seanie.

Pattons3rd · Joined: 28 Dec 2006 Posts: 1212 Location: Colorado

You could very easily use CSS on this, just use td as the selector.

seanie morris · Joined: 02 Jun 2005 Posts: 49 Location: Offaly, Ireland

so do you mean adding the:

<style=text/css......>

stuff inside the cell properties? I tried it and no joy. That means I'm doing it wrong...

seanie morris · Joined: 02 Jun 2005 Posts: 49 Location: Offaly, Ireland

Actually, I just answered my own query! The following works:

Add the following, unedited, into the <head> of the document:

<style type="text/css">
.mybgimage {
background-image: url(images/the_background_image.gif);
background-repeat: no-repeat;
}
</style>

REPLACE "images" with the folder name of the location of the image, and "the_background_image.gif" with the name of the background image.

In the cell to add the image to, the start of it (in the code view) starts with <td....>, for example:

<td width="300" height="180" (and other criteria...)...>

AFTER "<td" ENTER "class="mybgimage"" so that it will now look like this:

<td class="mybgimage" width="300" height="180" (and other criteria...)...>.

Sorted me out fine.

seanie morris · Joined: 02 Jun 2005 Posts: 49 Location: Offaly, Ireland

Oh, and to center it from both the top and left/right sides of your cell, add the line "background-position: center center;" to the head part:

<style type="text/css">
.mybgimage {
background-image: url(images/the_background_image.gif);
background-repeat: no-repeat;
background-position: center center;
}
</style>

Hope this helps future noobs in bgproperties!

Seanie.

Corey Bryant

cyberience · Joined: 03 Sep 2008 Posts: 1

So many people beat around the bush with a narrow thinking process.
I can see what you want, I will tell you simply.
That is the wrong way to do it within the confines of the purpose of CSS, but alas, there is a solution.
Unknown to many, you can embed CSS in any tag within HTML.
For example.
<p style="background: blue; color: white;">A new background and font color with inline CSS</p>

So to solve your dilemma. which is probably solved now anyway this is the solution...

<table style="background-image: url(background.jpg); background-repeat: no-repeat; background-position: center center;"> .......blah blah blah.

But, most people will tell you, this is defeating the purpose of CSS, where you can separate the styling from the html code.
but to me, this flexibility allows you to customise portions of a page, and I always use templates for me development, and prefer to keep all the formatting in 1 file, so whether it is in a css section,or embedded within the tags, is really up to your style and way of keeping track.

A good programmer can read code and work it out, and average programmer can only follow standards, and a bad programmer can make the best standards in the work completely unreadable!