/    Sign up×
Community /Pin to ProfileBookmark

Problem with background images in tables

Copy linkTweet thisAlerts:
Sep 25.2006

I put a background image in one of my table cells, cellspacing and cellpadding are both set to 0, there is a boarder (set to 3) and I don’t really want to remove it however, there’s an ugly little white line between the boarder and the background image in the cell… and it’s making me so freaking frustrated!

I don’t want the ugly little white line, but I want to keep the boarder and the background in the cell. Is it possible, and how?

Oh yeah, and I tried adding a background colour to the cell, but it didn’t help.

to post a comment
HTML

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@gil_davisSep 25.2006 — Chances are your white line is in the image.

Why don't you help us help you and give us more specific details - post the image and the web page code, or a link to your page.
Copy linkTweet thisAlerts:
@wiseguy007Sep 25.2006 — This will test the image to see if it has a white line around it or not. Just put the code

<img src="... border="0"> at the end of the the image tag. If the white line is still threre it is in your image. (Just open it in paint and cut the white line off). If not problem solved...
Copy linkTweet thisAlerts:
@MyconidauthorSep 25.2006 — I made the image, there is no white line (and I'm not quite that new to HTML :p )

For various reasons, I'd rather not send the actual page until it's up and running on the website so here's some helpful screenshots!

This is what I want it to look like - problem is I put the images in as images, not as a background, so I have to change the number of images in that cell for every different page I make with the template;

http://i50.photobucket.com/albums/f327/artistvisionary/looksgood.jpg

Here's what it looks like when they're a backround. Notice the little ugly white line? It's between the background and the boarder, not around the images...

http://i50.photobucket.com/albums/f327/artistvisionary/looksbad.jpg

Both these screenshots include one and a bit of the image (well, images, there's a left and right one) - Here's a link to the left image, not a screenshot so you can see there's no border, just in case you don't believe me;

http://i50.photobucket.com/albums/f327/artistvisionary/02sideap.jpg

Edit: Oh yeah! Nearly forgot to post the code, I'm guessing you won't need the whole thing, so here's the table start and the problem cell (which luckily is the first cell in the code!) Note; I did try putting a background colour in as well as an image, but nothing happened. Now hopefully this board has HTML disabled...

<table bgcolor=white border=3 cellspacing=0 bordercolor=#8241a0 width=900 cellpadding=0>

<tr VALIGN=TOP>

<td rowspan=8 background=http://i50.photobucket.com/albums/f327/artistvisionary/02sideap.jpg>

</td>
Copy linkTweet thisAlerts:
@WebJoelSep 25.2006 — It is only slightly more helpful that nothing at all. I can never quite understand the reluctance over posting a URL or pasting enough code to be of substainative use as anyone capable of helping you surely isn't going to need to Bogart your code. Being denied the ability to put your code snippette into (my/our/whomever's) html-editor and test it, is effectively denied and we are forced to 'guess'.. (But I do understand not wanting to divulge a work-in-progress, either. Esp. if there is pay involved ? ).

Anyway, yes, I do see that annoying little white line. Hmm...

-The image is in some kind of container, like a <TD> or <div>, yes? If you've declared no border for this image, -this image isn't a hyperlink by any chance is it? If it is, that may be over-riding the [B]border="0"[/B] or [B]border:0 none;[/B].

Does the <td> or <div> have a declared [B]background-color:rgb(120, 64, 161);[/B] (or [B]bgcolor="#8240a1"[/B] (depending upon how you wish to write this)? This is the purple-esque color of the image, and if the backgrond color is this, it might cover whatever 'margin' this white line is and solve the problem. But as I said, -I am guessing. ?

(edit: )

You posted some code! ? Yay! ?

(edit: )

Okay: try this:

<table border=3 cellspacing=0 bordercolor=#8241a0 width=900 cellpadding=0 [B]style="background-color:rgb(130,64,161)"[/B]>

(removed "bgcolor=white" in lieu of a background-color that matches the image. Might not be what you're after, but might identify the problem)
Copy linkTweet thisAlerts:
@MyconidauthorSep 26.2006 — No, not what I'm after as I want most of the table to be in white. I did try putting background colour into the cell (as seen below) but the line didn't go away.

<table bgcolor=white border=3 cellspacing=0 bordercolor=#8241a0 width=900 cellpadding=0>

<tr VALIGN=TOP>

<td rowspan=8 bgcolor=#8241a0 background=http://i50.photobucket.com/albums/f327/artistvisionary/02sideap.jpg>

</td>

Edit: Actually, on that note I suppose I could just add 'bgcolor=white' to all the cells I want white if trying that works... and it does work (why the hell didn't it work when I put the colour into the cell?) so now to put all those bgcolor=white's into the code... gah.

Thanks for your help!
×

Success!

Help @Myconid spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...