Last Resort-

Hello,
I have been having trouble with tables for my site for the lst few days, I cant seem to get it right. I realize this is a skinning MB, but, hopefully people here will extend the same friendliness there was a skinz.org.

Anyhow, if you are up to trying to help, here is my problem:
I made a table, with three images. I have one that is in one TD as BG that needs to go far left, and then I have on that is in another TD as a BG that needs to go to the far right, and then I have another one that is in another TD BG again) that needs to go between the two and make it seamless.
But, I do not know how I might go about doing this.
The URL is:
http://www.elvenlegend.f2s.com/Gemstone/layout.html

As it looks now, its one image doubling over, but look at the source to see how it is set up.

Hope someone takes the time to help me, a thousand thanks,
Andy Ladouceur
6,696 views 16 replies
Reply #1 Top
Your link is down... but if I understand you correctly try aligning all of your tags "top & left" and then center the whole table with either the tag or a tag.

Reply #2 Top
oh yeah... make sure that your table is the exact width and height of your three images combined.
Reply #3 Top
Sorry, the link is:
http://www.elvenlegend.f2s.com/gemstone/layout.html

And I can't quite do what you have suggested,take a look and you will seee why.
Reply #4 Top
http://www.elvenlegend.f2s.com/gemstone/layout.html

is the proper link. I don't understand the problem, it's doing exactly what you're telling it to. Looking at the source, here's some suggestions:

- the right cell is set to 400 pixels wide when the image is 300
- if you're not going to put any text in the left and right cells, put the images in as IMG tags, it's better and much more likely to render properly
- put some content in every cell. Netscape tends to not render empty cells, and IE doesn't render the middle cell properly in this case. Put in a non-breaking space (& nbsp; with no space) and lo and behold, it works.
Reply #7 Top
Not sure EXACTLY what you're trying to do, I made a page with what I can tell from your code, correcting a couple of things that weren't strictly correct (eg height and valign belong in tr, not td). Download my version from http://www.projectginger.com/gemstone.html - hope it's what you're looking for.

AJ
Reply #8 Top
And if you want the picture to repeat across the entire length of the screen, a table is not the answer, as each cell has to match the size of the image to be repeated, and there's no easy way to calculate the number of cells without making it scroll, something like this would be more appropriate:



This would tile the image across the top as a background. Let me know if neither of my answers are what you're looking for.

AJ
Reply #9 Top
it appears to have deleted my html, I'll add it in a commented line in the file I linked to in my previous post.
Reply #10 Top
Make a transparent 1 x 1 pixel transparent GIF and name it pixel.gif, then use this code:



 


Reply #11 Top
Hey!! Code is deleted from the msgboard...
Lets try this:
[TABLE border="0" cellPadding="0" cellSpacing="0" height="180" width="100%"
valign="top"]
[TR]
[TD background="layout_tl.gif" height="180" width="300"][img src="pixel.gif" width="300" height="1">[/TD]
[TD background="layout_tm.gif" height="180"] [/TD]
[TD align="right" background="layout_tl.gif" height="180"
width="300"][img src="pixel.gif" width="300" height="1"][/TD]
[/TR]
[/TABLE]

Of course replace the brakets with HTML ones.
Reply #12 Top
That wouldn't work Paxx, the problem is that the table is 100% width, and if the tds don't fill that amount, then they will be stretched to compensate, causing the overlapping.
Reply #13 Top
sorry, to hammer this thread....either that, or specify 100% width in the middle table data.
Reply #14 Top
The code I typed works. I tested it myself.
The problem with IE is that TD widths are not kept unless they is content in it to force it to that width. Therefore the 1 pixel image that you stretch to the width you want your cell to be.
Try it, you'll see it works.
Reply #15 Top
Right you are sir, because the middle cell is of unspecified width it will stretch to fit if the other 2 fit their content, so both methods work. I'm still not sure as to what exactly Mr. Silvergem was trying to achieve with his page though, but whatever it was, I'm sure between us he's got enough to get it working now.

Cheers,

AJ