|
HTML - Problems Stretching An Image In A Td Tag
Hi All,
I have a problem that seems to only occurs in IE (i'm currently using IE8). Basically, i have web pages that consist of a header, content area and a footer. I am trying to stretch an image to be displayed as a left and right border in the content area. the image is not a solid color, so simply setting a border property would not work. In all browsers but IE, the image stretches just fine. The site is heavily table based due to the fact that it is written for a CMS known as NetSuite. A lot of the tables and html are created by the CMS and are very difficult and tricky to modify. You can see the page in action at - http://staging.marware.com/iphone-cases/iphone-4-cases I have tried numerous combinations of height:100% and different positioning values with little help. One of the problems is that the height of the content area is dynamically set. The code in place now looks like this: <table border="0" cellpadding="0" cellspacing="0" width="1020" height="100%" align="center"> <tr style="height:100%;"> <!-- left side image --> <td style="width:9px; height:100%;"><img src="http://www.marware.com/images/body_outer_border.png" border="0" height="100%" width="9" /></td> <td valign="top" width="400" align="center"> <!-- right side image --> <td style="width:9px; height:100%;"><img src="http://www.marware.com/images/body_outer_border.png" border="0" height="100%" width="9" /></td> </tr> </table> Similar TutorialsI am trying to put a background image but, it seems to be tiled instead of stretched. I want it to be all one image in the background, not a repeated image of itself off to the side of the moniter. I am using the string: background image="001back" -- That's without the brackets because i don't think it would show with them. Any suggestions on fixing this? Or stretching the background? this is my page http://web.vtc.edu/users/cjb06271/CI...nal/order.html there are several things I would like to happen. 1. the right collumn background to be where the right collumn should be(so other links in navbar) 2.The test between the roach pictures to be alligned with the top rather than bottom of pictures (so smaller windows can see) 3. When you size the window smaller than the text, a scroll bar appears, and when you scroll the background no longer exists. If I put it on auto the background will only go as far as the text does. 4. (nice but not required)The cocroachs to be alligned to the left and right of the top bar respectively, and the text in the middle. 5. (nice but not required) the right column background image is being cut in half (as does the top one if you size small enough). any way to make the images ignore the collumns? don't worry about the colors I will be changing them soon Source: http://www.sedition-gaming.com There are a couple of problems on the page in IE that I don't see in Firefox. 1. The blue bars at the top and bottom are both only supposed to be 4px tall, yet for some reason, IE is making them stretched out around 10-15. I imagine the problem is because of the clear.gif inside it, but I haven't a clue why since I have the cellpadding set at 0 on all sides. Code: <tr> <td background="images/site/bluebar-top.gif" height="4" style="bluebar"><img src="images/site/clear.gif" width="1" height="1" border="0"> </td> </tr> Code: td.bluebar
{
padding: 0px 0px 0px 0px;
}
2. Not an image problem, but a question about IE: I have table cell rollovers in the navigation bar that work in FF but not in IE: Does IE not support td cell rollovers? Thanks in advance! So I have to make a basic html site for a class project and I am having some browser problems. On IE some of my images are not showing up (red X), but they work fine on Firefox and Safari. On Firefox none of my links are changing color when they are visited, but they are on IE and Safari. Ideally, I would like my site to work correctly on either IE or Firefox, but not necessarily both. What are some possible fixes for my problems? Thanks in advance Gahh! I tried to make my own image map but for some reason it's just no working! Can someone look at the code and see if there's any mistakes or anything please? I tried taking out the decimals but that didn't seem to help it either. HTML Code: <MAP NAME="MyMap"> <AREA SHAPE="Rect" HREF="http://www.freewebs.com/dent-gas/dent%26oralsurg.htm" COORDS="0,0 3.5,2.5"> <AREA SHAPE="Rect" HREF="http://www.freewebs.com/dent-gas/cossurg.htm" COORDS="6.7,0 10.5,2.5"> <AREA SHAPE="Rect" HREF="http://www.freewebs.com/dent-gas/emergoxy.htm" COORDS="3.8,2.6 6.8,4.4"> <AREA SHAPE="Rect" HREF="http://www.freewebs.com/dent-gas/vet.htm" COORDS="0,4.5 3.5,7"> <AREA SHAPE="Rect" HREF="http://www.freewebs.com/dent-gas/custom.htm" COORDS="7,4.6 10.5,6.5"> </MAP> <IMG USEMAP="#MyMap" SRC="http://www.freewebs.com/dent-gas/homeboxes.gif" BORDER="0"> Basically I've got my header image which has its width set to 100% so that it adjusts for different resolutions. It seems to work fine on all of my web browsers (FF, IE, Safari, Chrome, Opera). When my client looked at the website on their computer it seems the image seemed to be overly large. I can't be sure exactly what the problem is by their description, which makes it even harder to solve. I have no way at all of reproducing this problem. It's a simple image inside a table cell. The XHTML has been fully validated and as I said it looks fine on all my web browsers. I asked what version of IE she was using, and it was the same as mine, so I'm super confused and don't know how to fix this. Any help would be great. EDIT: The website is www.whale-cove.com.au if some kind people want to take a look and tell me if it looks awkward. Hello Everyone! I am having a problem... I have a specific colour I would like my header to be but the spacer image is another colour?? I have tried removing the spacer image but it does not go away, I have tried removing nesting or clearing cell heights but they just mess up the entire page. Is there no way to just change the Spacer Image Colour? Thanks for you replies in advanced I have a issue with a google checkout add to cart button. I've added the code from the site and the button appears in the top left hand corner of the screen. I've tried opening the files in frontpage and drag and dropping it, but for some reason the button doesnt show there. If any can help please do. Thanks This is the Html i've got in the page for the part. <html> <img border="0" src="hill.jpg" width="150" height="137"></p> <p> & nbsp;<div class="product"><input value="Metal" class="product-title" type="hidden"><input value="14.99" class="product-price" type="hidden"><div title="Add to cart" role="button" tabindex="0" class="googlecart-add-button"></div></div></p> <div class="product"><input value="Silent Hill" class="product-title" type="hidden"><input value="14.99" class="product-price" type="hidden"><div title="Add to cart" role="button" tabindex="0" class="googlecart-add-button"></div></div> </body> </html> I've never had this problem before but I uploaded a lot of images and put them in a gallery using an image hyperlink with thel image being a thumbnail and the link being the larger image. The problem is when I click the thumbnail the larger image has this white background around it. Is there anyway to fix this? or What am I doing wrong? my code looks like this <a href="http://www.eccentrix.com/members/carmellady/portfolio/DSC0006.jpg" target="http://www.eccentrix.com/members/carmellady/IFRAMEURL2.html" border="0"> <img src="http://www.eccentrix.com/members/carmellady/Thumbnails/06TH.jpg" HEIGHT="20" WIDTH="20" border=0></a> I have never encountered this problem before and can't figure it out. I've created an include file that holds my left nav. It's a table that holds various images that are links. But the last two buttons (that are simple and small gifs) I've created will not render at all in IE6. In view source it shows the table tags fine, but strips out the image tags for those buttons. The really weird thing is that everyone else can see the images on their computers in Firefox, IE6 and IE7, Mozilla, etc... Also, if I take the actual links out of the href tag and leave it blank, the images show up fine. What the heck is wrong with my browser??? Hello ladies and gentlemen. Im having trouble aligning some buttons i made with an a big image and small image of the like. They need to look like this... http://i217.photobucket.com/albums/c...wayne/main.jpg but currently are out of sync and all stuffed up. I was wondering what i could do to correct he problem and make it like the image above. Thanks in advance I am new to html. I just wanted to find out how to get the coordinates for an image. Is there some type of program you put it in to get the exact coordinates? Please help... code: Code: <img src="/home/brokenbot/Pictures/rihanna-beat-up1.jpg" width="500" length="600" alt="Rihanna Beat Up" usemap="rihannapractice" /> <map name="rihannapractice"> <area shape="circle" coords= I'm lost on where to even start to find my coordinates. I confess that I am a total 'noob' at 74 years old, and will probably get flamed for this question - but here goes - I have taken the on-line HTML course for basic set up and have built a web page; however, it is so bad I do not want to launch it until I can get some issues corrected. PROBLEM 1 - I built the file in 'notepad' text writer. When I look at my internet at 'open', 'brouse', 'index.html' file, and select 'OK', the features show up as I want; however, when I upload the file to my web page, the image is a square with a red X. I set up the image by adding the following line to the file: <img src="xxx.jpg"> PROBLEM 2- In spite of adding <p> </p> at the beginning and ending of my paragraphs, after uploading, the webpage displays each paragraph of text as one long line of text. Can someone advise where I am going wrong? Bob Hey, I've recently set up a small e-bay business, and have had a few problems in designing the listings. Mainly with this one; http://cgi.ebay.co.uk/ws/eBayISAPI.d...MESE:IT&ih=019 I want to replace the solid blue colour that's running around and between the tables with a tiled image, but after two hours of failed trial and error, I have no idea what to change in the HTML without putting a background image on the whole page. It's soo frustrating, Can anyone please help? Thank you, Jeremy I'm actually having the same problem I've seen wandering about, and I've already considered all the given advice and nothing seems to be working. The background image is split into a 3x3 table for easier loading, and now I'm getting a small gap between the rows themselves. This is the page: http://akito.clavis-sama.com/ I don't have any <p> tags and my margins are all set to 0 already. Yet I have those lines in the middle of my table for the header image. Any clue as to what the problem could be? Hi everyone, My website, currently at http://www.mlcprop.com/index2.html , is having issues. They a 1.) There is lots of extra space at the bottom when viewed in IE. 2.) The drop-down menu (click "apartments") doesn't display properly in IE; there is supposed to be a green background. It displays fine in Safari/Firefox/Opera however. 3.) I'm having trouble getting the bottom section to work properly. There's supposed to be a green gradient background for the content area that fades out to the page's brown background color. I did this by creating a central table cell with a tiling background image of the green gradient that's very tall and narrow. However, some pages are VERY long... such as thisone. How do I account for this? I tried matching the cell's background color to the image but it doesn't seem to match, or should I just make my tiling green background super long to account for this? I didn't want the file size to be huge. The lower left table cell ("footl") doesn't seem to display properly either. There's supposed to be an image there, a subtle shadow effect. It displays fine on the right ("footr"). Can anyone help with any of these? Thanks so much, Tatiana Hello, I have recently ran into an issue with tables. I set a table width to 800px, and I want it so the text automatically breaks down to the next line instead of stretching the table past 800px wide. A solution that functions in both IE and FF would be very much appreciated. Thank you hello why does the stretched gif which makes the right-hand column work on this page - http://www.testtracks.com/bios.html get broken when it goes to this page? - http://www.testtracks.com/test.html help very much appreciated, thanks sandy hi i'm new! i'm pretty good with html and i'm setting up my website, jesse-m.com. if you go to this link: http://jesse-m.com/fourth%20layout/header_test.php, that is what i want the sidebar to look like. but when i put my cutenews code in under the news section, this is what happens to the sidebar: http://jesse-m.com/fourth%20layout/header.php how do i make the sidebar not follow the height of the news section? i don't want it to stretch! i just want it to stop when it has nothing else to show and just continue the white background. because it's a php document, here is the source of the page WITH the cutenews: PHP Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <style type="text/css"> <!-- body { background-color: #E4E4E4; } --> </style> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>» JESSE-M.COM • a number one source for jesse mccartney fans</title> <link rel="stylesheet" href="http://www.katiecassidyfan.com/jesse/fourth layout/style.css" type="text/css" /> </head> <body> <div align="center"> <table width="610" border="0"> <tr> <td><img src="header.png" width="610" height="271" /></td> </tr> </table> <table width="614" border="0"> <tr> <td width="184" height="10" valign="top" class="sidebar">WELCOME</td> <td width="420" valign="top" class="sidebar">NEWS</td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF">welcome to jesse-m.com! we have been down for awhile but are now back stronger than ever and ready to supply you with the latest jesse gossip, pictures, and news. be sure to check back multiple times throughout the day because we will be following jesse's foot steps throughout his busy career and are happy to keep his most dedicated fans up to date.</td> <td rowspan="17" valign="top" bgcolor="#FFFFFF" class="news"><?PHP $number=10; include("/home/content/k/a/t/katiefan/html/jesse/cutenews/show_news.php"); ?></td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF" class="sidebar">STATISTICS </td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF">owners: kirstie and ana <br /> opened: march 1st, 2008<br /> layout version: 2<br /> host: <a href="http://www.katiecassidyfan.com" target="_blank">katiecassidyfan</a><br /> contact: <a href="mailto:staff@jesse-m.com">staff@jesse-m.com</a> </td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF" class="sidebar">NAVIGATION</td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF"><a href="jesse">jesse</a>: facts, biography, awards<br /> <a href="http://www.jesse-m.com/gallery" target="_blank">gallery</a>: candids, photographs, scans<br /> <a href="video" target="_blank">video vault</a>: interviews, tv, movies<br /> <a href="web" target="_blank">web</a>: affiliates, links, official sources<br /> <a href="site" target="_blank">site</a>: information, webmasters, past</td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF" class="sidebar">MUSIC PLAYER </td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF"><center><object type="application/x-shockwave-flash" width="171" height="83" data="http://katiecassidyfan.com/jesse/test/second/xspf_player.swf?playlist_url=http://katiecassidyfan.com/jesse/test/second/playlist.xspf"> <param name="movie" value="http://katiecassidyfan.com/jesse/test/second/xspf_player.swf?playlist_url=http://katiecassidyfan.com/jesse/test/second/playlist.xspf" /> <embed src="http://katiecassidyfan.com/jesse/test/second/xspf_player.swf?playlist_url=http://katiecassidyfan.com/jesse/test/second/playlist.xspf" width="171" height="83"></embed> </object></center></td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF" class="sidebar">RECENT PICTURES </td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF"> </td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF" class="sidebar">ELITE AFFILIATES </td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF">1. <a href="http://www.katiecassidyfan.com" target="_blank">katie cassidy fan</a><br /> 2. <a href="http://www.glorianafans.com/" target="_blank">Gloriana Fans</a><br /> 3. because we have not been online for awhile, we erased all of our affiliates. if you'd like to be an elite, please contact us! </td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF" class="sidebar">PROJECTS</td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF">"wanted" - body fragrance<br /> "alvin and the chipmunks: 2" - cinema </td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF" class="sidebar">TAGBOARD</td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF"><Center><!-- BEGIN CBOX - www.cbox.ws - v001 --> <div id="cboxdiv" style="text-align: center; line-height: 0"> <div><iframe frameborder="0" width="175" height="180" src="http://www3.cbox.ws/box/?boxid=3017165&boxtag=7321&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#EBEBEB 1px solid;" id="cboxmain"></iframe></div> <div><iframe frameborder="0" width="175" height="75" src="http://www3.cbox.ws/box/?boxid=3017165&boxtag=7321&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#EBEBEB 1px solid;border-top:0px" id="cboxform"></iframe></div> </div> <!-- END CBOX --></center></td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF" class="sidebar">DISCLAIMER</td> </tr> <tr> <td height="10" valign="top" bgcolor="#FFFFFF">jesse-m.com is a fansite and <em>only</em> a fansite for <strong>jesse mccartney</strong>. we are no way affiliated with jesse or his management unless stated so. we do not pose to be him or any of his family members and any exclusive information that is sent to this site is for our use, <em>and our use</em>, <u>only</u>. everything on this site was created by either ana or kirstie and are not be resdistrubited any where else without persmission. these graphics are ours and not yours to use! all photos, videos, articles and interviews are owned by copyright their respective owners. jf you'd like to have any illegal content removed, please <a href="http://www.katiecassidyfan.com/jesse/staff@jesse-m.com">e-mail</a> us before taking an legal action. we would love to cooperate with you.</td> </tr> <tr class="bottom"> <td height="10" colspan="2" valign="top" bgcolor="#FFFFFF"><div align="center">copyright: <strong>JESSE-M.COM</strong> | opened: 2008 | <a href="jesse">Jesse</a>, <a href="gallery">Gallery</a>, <a href="video">Video Vault</a> | Hits: <!-- Start FastWebCounter.com --> <script src="http://fastwebcounter.com/secure.php?s=www.jesse-m.com"></script> <!-- End FastWebCounter.com --> | Online: <!-- Start FastOnlineUsers.com --> <script type="text/javascript" src="http://fastonlineusers.com/on2.php?d=www.jesse-m.com"></script> <!-- End FastOnlineUsers.com --></div></td> </tr> </table> <p><br /> </p> </div></body> </html> Hello everyone! I am having a trouble coding a website design. I am not even sure this is possible, but how can I stretch a window (pop-up window) between the top and the bottom of the page (so when I open the window on a larger display it looks the same)? Thank you in advance, Andrei |
|||||||