Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Markup (HTML, XHTML, XML) _ Table image spills out past the table

Posted by: klynnk1 Jun 29 2012, 12:44 PM

I have a template that I use on Ebay. I have tried to clean up my CSS and HTML a bit and have run into a problem.

Here is what I had originally
http://www.ebay.com/itm/1D-101-Facts-One-Direction-3-page-Article-A100-8x11-NEW-J-14-clipping-/400302839511?pt=LH_DefaultDomain_0&hash=item5d33e896d7
(it looked ok on my computer and a few others I checked, but the teal background ran all the way up into the Ebay info at the top of the page when viewed on my sister's computer ... IE9 is what she thinks she is using)

When I look at my new revised layout on my computer everything looks fine. But once I use it as a template for ebay the table background spills out and runs the full screen.

Here's the new test example:
http://cgi.ebay.com/ws/eBayISAPI.dll?ViewItem&item=150847451890

body {
font-family: "Trebuchet MS", Helvetica, sans-serif;
background-color: #476B6B;
background-image: url(http://imgs.inkfrog.com/pix/klynnk1/Pinups_Template_2012.jpg);
padding: 0; margin: 0;
text-align: left;
font-size: 1.05em;
color: #FFFFFF;
line-height: 125%;
text-align: center;
}

table {
background: url(http://imgs.inkfrog.com/pix/klynnk1/ebay_black_noise.jpg);
width: 850px;
border-width: 4px;
border-style: solid;
border-color: maroon;
border-top: none;
text-align: center;
margin-left: auto;
margin-right: auto;
}

<table width="100%" border="0" cellspacing="2" cellpadding="2">

<tr>
<td align=center colspan=5><img src="http://imgs.inkfrog.com/pix/klynnk1/New_UFO_n_Cow_6.jpg" alt="UFO and Cow">
</td>
</tr>

I have put my new markup in the validator and I only get a few errors regarding the thumbnails
character ";" not allowed in attribute specification list I'm not too worrried about those.

Any suggestions on restraining the background image for the table?

Posted by: pandy Jun 29 2012, 01:12 PM

What browser? I don't see anything spilling out in gecko. With IE7 I get redirected to a peculiar error page.
http://pages.ebay.com/messages/page_not_responding.html?eBayErrorEventName=p4%60bo7%60jtb9%3Fuk.rp*3%605b25%60-2012.06.29.11.11.29.692.MST

Posted by: klynnk1 Jun 29 2012, 01:50 PM

QUOTE(pandy @ Jun 29 2012, 01:12 PM)

Here's another link to it. I'm using Firefox.

http://www.ebay.com/itm/150847451890?ru=http%3A%2F%2Fwww.ebay.com%2Fsch%2Fi.html%3F_from%3DR40%26_nkw%3D150847451890%26_rdc%3D1

I believe if I change the % to a smaller table width I can get rid of the overspill past the table ... however it will still extend below the table to the bottom of the page.

<table width="100%" border="0" cellspacing="2" cellpadding="2">

Can I just delete any table info in the markup section since I now have a table in CSS ... (this is just leftover from the way it was set up before).

Posted by: pandy Jul 1 2012, 07:20 AM

The page is very wide but I'm not sure I see anything spilling over.

Posted by: klynnk1 Jul 1 2012, 10:26 AM

QUOTE(pandy @ Jul 1 2012, 07:20 AM)

The page is very wide but I'm not sure I see anything spilling over.

It isn't supposed to be that wide. I want it to stop at the width of the "Buy Stuff Here" header. There is a red border around my table and then there is a second area of black with another red border ... the second area is what I call the spillover. I want my background to end around the table and not extend all the way out to the sides and bottom.

Posted by: pandy Jul 1 2012, 01:48 PM

For me it's the table above that's wide, the one with the picture of the band.

I'm sorry, I tried to see if something jumped out and it didn't. This kind of pages are very hard to debug. The whole eBay is a big HTML error and there's always so darn much HTML. I'm afraid your page is no exception. It has http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ebay.com%2Fitm%2F150847451890%3Fru%3Dhttp%253A%252F%252Fwww.ebay.com%252Fsch%252Fi.html%253F_from%253DR40%2526_nkw%253D150847451890%2526_rdc%253D1&charset=%28detect+automatically%29&doctype=Inline&group=0. Didn't even bother with the CSS ones. When you don't find something fishy right off you need to go through it all and correct the errors to untangle the mess. Again, sorry, but it's just too much on a summer evening especially since I'm not certain what changes eBay lets you do anyway.

Posted by: klynnk1 Jul 1 2012, 02:19 PM

Ebay has so much muddled code that I couldn't make heads or tails of it. I could barely make out my code in all their tangled mess.

oh well - Thanks for taking a look at it ... Looks like I will trash this attempt and go on to Plan B ...

QUOTE(pandy @ Jul 1 2012, 01:48 PM)

For me it's the table above that's wide, the one with the picture of the band.

I'm sorry, I tried to see if something jumped out and it didn't. This kind of pages are very hard to debug. The whole eBay is a big HTML error and there's always so darn much HTML. I'm afraid your page is no exception. It has http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ebay.com%2Fitm%2F150847451890%3Fru%3Dhttp%253A%252F%252Fwww.ebay.com%252Fsch%252Fi.html%253F_from%253DR40%2526_nkw%253D150847451890%2526_rdc%253D1&charset=%28detect+automatically%29&doctype=Inline&group=0. Didn't even bother with the CSS ones. When you don't find something fishy right off you need to go through it all and correct the errors to untangle the mess. Again, sorry, but it's just too much on a summer evening especially since I'm not certain what changes eBay lets you do anyway.

Posted by: pandy Jul 1 2012, 03:00 PM

Probably the best approach is K.I.S.S. The less you add the less eBay can screw it up.