HTML - Background Img's Effected By Cellpadding
hi all,
ive just finished the graphics 4 my layout and assembled them using html tables however when i set the cell padding to anything above '0' all the background img and other images shift out of place. i had all the text looking just right with cellpadding at '10' but all graphics look bad. however with padding at '0' the graphics look good/correct but the text is all pushed up against the left side of the cells. i suppose i can use nbsp's but would just like to get my head around it is their a way to lock the bground pics in place and still have cell padding above '0' without effecting the background images? many thanks Similar TutorialsBasically I am constructing a product page for a client and I wish to bring each row closer togther. http://www.predatorequipmentni.com/products.php Currently it is looking like this: [] [] [] [] [] [] [] [] [] Where as I wish it to look more like whats shown below: [] [] [] [] [] [] [] [] [] I guess what I am after is a way of reducing the padding on the top and the bottom of the cells. Any pointers would be great! HTML Code: <table width="879" body background="images/whiteblackline.jpg" bordercolor="#000000" bgcolor="#FFFFFF" border="0" align="middle" cellpadding ="35" cellspacing="0"> <tr valign="center"> <td width="293" td align="center"><div align="left"> <p><img src="images/trailers/1.jpg" width="220" height="150" border="0"><br> <br> <span class="style3"><strong>GD84GTA</strong> 8’x4’ Mini Plant Trailer. (16” High sides/<br> Plastic mudguards. 2700kg gross capacity. Includes High Ramp, Bucket Stand and Rear Prop Stands as standard).</span> <br><img src="images/details.jpg" width="80" height="27" border="0"></p> </div></td> <td width="293" td align="center"><div align="left"> <p><img src="images/trailers/1.jpg" width="220" height="150" border="0"><br> <br> <span class="style3"><strong>GD84GTA</strong> 8’x4’ Mini Plant Trailer. (16” High sides/<br> Plastic mudguards. 2700kg gross capacity. Includes High Ramp, Bucket Stand and Rear Prop Stands as standard).</span> <br><img src="images/details.jpg" width="80" height="27" border="0"></p> </div></td> <td width="293" td align="center"><div align="left"> <p><img src="images/trailers/1.jpg" width="220" height="150" border="0"><br> <br> <span class="style3"><strong>GD84GTA</strong> 8’x4’ Mini Plant Trailer. (16” High sides/<br> Plastic mudguards. 2700kg gross capacity. Includes High Ramp, Bucket Stand and Rear Prop Stands as standard).</span> <br><img src="images/details.jpg" width="80" height="27" border="0"></p> </div></td> </tr> </table> Is it possible to put a smaller background image on top (like in layers) of my old background image? I have a background image, but I want to put a smaller image on top of that one, but for it to be treated also as background image. This image is a black vertical rectangle, but is faded on the edges to give a transparency, so its a .png. So ultimately what I am trying to do is put this black rectanlge on top of my original background image and with the transparency on the edges of this image, be able to see my original background image. How can I do so? Also what I was thinking was that this faded background would be scaled to fit different screen sizes, so do "width: 75%"? Just so that it ALWAYS stays at 75% no matter what screen size it is viewed on. Is this the right approach towards getting this result? I've just put up a new page - mbccc.net - and I've used a picture, a .jpg image file, for the background. Sometimes it displays alright but sometimes it doesn't - sometimes it begins to 'tile' at the edge. When I view the page in my IIS on localhost it always does that. When I view it in my html editor - NVU - it always does it. My question is why does it do that and what can I do to prevent it? The picture is 196kB .jpg of 1024 x 768 pixels. I've been viewing in Firefox, what it does in other browsers I don't know. What should we do if we want to use pictures for background? regards, ab I'd like to have a scaling background like on this site: www.burton.com I'm using DreamWeaver, is this possible? P.S., I'd also like to build a scaling x-y navbar like they have on that site if it's possible. Thanks in advance! hi in this site www.muaythaistuff.com they have some tatoo kinda background and i have tried to put this one on my site and it makes a lot of them in one page so my question is how can i set this tatoo image only in the top like in this very site and the rest will be black color? Hi, I wanted to use an image for the background of my page, but also have a DIV layer with images that look like they are coming out of it. For some reason though when I set the image as the background, it becomes just a bit brighter. This completely throws off what I'm trying to do because there are elements of the background in the DIV layer image and now the DIV image looks darker than the background ruining the effect. So I've tried to solve the problem by putting this huge background image as a DIV layer and aligning it to top: 0 left: 0. The colors now match. The problem is though that the image is way bigger than the browser window so scrollbars appear on the sides. I don't want this. Can anyone offer a suggestion to either of my problems? Thanks! Hi i have an issue with my background not displaying correctly. I know i have not sliced the template etc but i can only assume the same problem will occur when i do. I have set a background image to the page but its not inline with my image background, How would i go about making sure everything is lined up when publishing it? Ive messed around with margins etc but there seems to be a default margin at the top which i cant remove. http://www.banks-twins.biz/testhome.html Thanks. Alex. I want to give a division a background image but I'm not sure how to do it. I wrote a code that says: Code: #links { background-image: Graphic1.png } But nothing happened. What am I doing wrong nad how can I fix it? Okay, I have this background image...it's fine and dandy...but I want the stripes on the left side to continue to go down the page if more information is put on the page and it not stop at where it does on the page. I can't repeat it because THE EXOTIC ZOO will be repeated too down the page. Any suggestions of what to do? Here is the page I'm talking about: http://thexoticzoo.webs.com/rats.html nevermind... Thank you for helping and this site is awesome! Take care... Ryan Hey all Ok i wasnt sure wether to put this in html or css but i decided to put it here and hpe for the best. Ok , I have set a background color and a background image which all works well. Except that when i insert the banner it isnt at the top of the screen it is about a cm down from the top. This is because of the background image but im not sure how to fix it. Thankyou in advance, Jake. How can I set background in a page. please help me. im trying to use a image hosting site to make a image a background for a web site so they can see my idea what would the code look like to make that happen hey everyone, when im making my website i put something in it then move it up the website to a different position so its where i wnt it. when i move this up my website it leaves a blank space at the bottom. how do i get rid of thisblank space?? the code im using is... <div style="position: relative; top: -300px; left: 200px;"> ive also tryed postioning it in css and its just doing the same thing if someone could please help i would be very grateful thanks Heres the link Well, It looks fine, unless you view it in full screen, if you view it in full screen you'll notice that the white and grey backgrounds extend along with the main background, I want the white and grey background to stop where the footer is, and the main background (#cccccc) to continue on down. You can use View > Source for the source code (as it's rather big and I'd rather not have something that big in my post) CSS Code: Quote: .leftcolumn{ width:273px; padding-left:9px; padding-bottom:20px; background: #F1F1F1; float:left; text-align:left; } .rightcolumn{ width:503px; float:right; text-align:left; } left column = grey column right column = white column How to insert a background on this site ? http://videosearch.w-b0x.com/ Hello. I need some assistance in figure out how to make a fixed/linkable/image. I used this code here
HTML Code: <body style="background-attachment: fixed; background-repeat: no-repeat;" background="XXX.jpg"> which worked great in keeping its place. Then I added HTML Code: <a href="http://www.davesite.com/"> before and after but no luck. Im trying to get that link to work for the background too, but its not working out at all. "Sadly no HTML skills whatsoever" Ok - first of all I'm quite sure that you can't actually like an image, but is there anyway that I could link the blue circle on this site with some kind of HTML/CSS workaround? http://www.yearofthebus.co.uk All suggestions welcome. Thank you, Steve Hello! I have just started using HTML, and Im already stuck! I want to have a blue background, with a limited white frame (like the white frame you can see he http://xrk.no/ ). The background color is no problem, but how do I make that white frame, without using a picture? Hope this one is a easy one for you! Thanks I have a problem with my portfolio site, I don't have much experience with web design or anything like that, I just needed a site for job applications. Anyways, I made the site layout in Photoshop, then I sliced it up and brought it into Dreamweaver, everything is looking the way it's supposed to but because I used slices to create everything, the background is in pieces and when you go on the site, you can click and drag every piece of the background (with Firefox and Safari at least). Is there a way to lock the image down so it is no longer draggable? Thanks for the help. |