HTML - Transparent Image Link Border Showing :(
Similar TutorialsHi, I've been working on a site: www.ssvfd.com/newsite/main.php In Firefox underneath of the news image I have a link to burtonsvillevfd.com In firefox it's blue, yet in IE it's the way it's suppose to be. I can't seem to figure out why thats the only link that doesn't define the way I want it to (links in the footer define fine) and than the "news" image in Internet explorer has a grey background, where it's suppose to be transparent. Any ideas on how to fix that? Hi guys Just joined and hoping someone can offer some advice on an issue. I want a black border around images which show up jsut fine in IE but some reason the border does not appear in FF. The below is an example of what i am doing. <IMG STYLE="position:absolute; TOP:110px; LEFT:610px; WIDTH:180px; HEIGHT:190px" src="Optimized-027edited.jpg" style="border-style: solid; border-color: black;"/> Does anyone have any advice on where what I can do to make the border show up in both browsers? Any help appreciated. Cheers Hi, I'm new here, and even new to coding websites. Well, it's going pretty well this far I think, but I have one problem now. I have placed a picture/logo which I have turned into a link. It's working very well and looks great, in Google Chrome! But in IE there's a "border" which is blue, and with mouse over it's red. Like all the other links on my site. But I don't want this "border" to be there, just like in Chrome. I have tried almost everything to remove it, but I can't. And I can't even figure out why it's there. Can somebody help me? Thank you. Best regards Thomas. Hi, I am using Dreamweaver CS3 to create a site, by default i have learnt that when you use an image as a link to another page, dreamweaver creates a coloured border around your linked image. I have since been able to get rid of this border by adding border="0" into my img tag however this now has caused my rollover not to work before clicking on the image to take you to the linked page. this is my code; any ideas how i can fix this? <td colspan="4"> <a href="About Us.html"><img src="images/About_Off.jpg" border="0" alt="About Us" name="Aboutus" width="120" height="64" id="Aboutus" onMouseOver="MM_swapImage('Image2','','images/About_On.jpg',1)" onMouseOut="MM_swapImgRestore()"></a></td> <td colspan="6"> Any help would be greatly appreciated. Hi Friends, I have problem in IE6 using transparent png image. I have already include the IE6 png fix javascript file. If suppose using img tag, its no problem, but I set the png image within my td background its not display properly. here my code : <td align="center" valign="middle" style="background-image:url(images/footer_bg.png); background-repeat:no-repeat;"> also i attached the sample image. this is my problem. so anybody knows or face the same problem give me the solutions. Yours, vjn_23 (vijayan M) Can you make an Image be transparent, like in photoshop? (see image attached) I want to make the white space in my top banner transparent so that you can see the background image below it. I have created a website www.aplexia-villas.co.uk. The problem is with two of the images. They have a gray background in IE, but on firefox they are fine. Does anyone know how i can make the transparency work? I have tried different formats: .png .jpeg .gif Thanks for you help. Hi people, I've search the net regarding this issue and from what I've gathered, images can only be transparent provided it's in the gif format. May I know is it possible to make png pictures transparent? I heard that's possible with IE 7, but I want a method that works with lowers versions of IE too. I'm trying to avoid CSS if possible, is there a code something like "style=transparent" that can be typed into the <img> tag? Thanks Hi, I have a problem with an image link. After it is pressed it will have a potted border and i cant get rid of it. (img of the border attached) Is there a smart solution to this? Ive tried to set border to 0 for both img and a, but it was no help. I've searched for an answer to tis both on google and here but could not find anything. Parashurama Hi, can somebody look at my website and tell me why my email address link isn't showing up on my page. The page is www.marksbodyshop.org/contactus.htm The page is one large image with links. Here is the html 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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="language" content="english"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta name="Description" content="Marks Body Shop has served Southern Arizona for over 25 years. Located in Sahuarita, Arizona. Over 25,000 cars built. Free Estimates. We strive to exceed customer satisfaction. We offer timely repair and competetive pricing."> <meta name="Keywords" content="Auto, the, marks, Body, cars, price, prices, paint, dent, paintless, repairs, estimate, estimates, job, and, scratch, custom, best, mark's, shop, shops, repair, collision, green valley, sahuarita, arizona, painting, car, automotive"> <title>Marks Body Shop</title> <link rel="stylesheet" type="text/css" href="css/defult.css"> <script type="text/javascript" src="js/jquery-1.4.1.min.js"></script> <script type="text/javascript" src="js/jquery.metadata.min.js"></script> <script type="text/javascript"> $(function() { $('#home_anchor').mousedown(function(){ $("#homeimg").attr('src',"button/home-03.png"); }); $("#home_anchor").hover( function () { $("#homeimg").attr('src',"button/home-02.png"); }, function () { $("#homeimg").attr('src',"button/home-01.png"); } ); }); </script> </head> <body> <div id="bg"> <img style="display:block;" src="images/contactuspic.gif"/> </div> <div id="position1"> <div ><a href="index.html" id="home_anchor" ><img id="homeimg" width="50%" border="0" src="button/home-01.png"></a></div> </div> <a href="mailto:mark.marksbodyshop@gmail.com">Mark.Marksbodyshop@gmail.com</a> </body> </html> Thank you I have had this problem on almost all the websites I've made and I'm too picky to let it go... When I make the navigation images/buttons for a website, I set the border to zero as usual and link each image to its respective page. But, when I click on the image to take me where it's supposed to, this pesky dotted border appears around the edge of the image after it has been clicked and it remains there until I click on something else on that page. (This also happens to text links when clicked, but I'm not too worried about the text links.) For the websites I've made that go to an entirely new page after an image link is clicked, the dotted line appears around the linked image after it's clicked and before the next page has loaded, but then after the new page loads the dotted line is gone. But, for websites I have built that utilize frames, because the new page that loads is in an iframe, and because the page the navigation buttons are located on never changes, the dotted border stays around the image after its been clicked and, like I mentioned earlier, doesn't go away until I click on something else on that same page. An example of this can be seen when you click the images in the navigation column along the left side of a website I built located at the following URL: http://www.djprogress1.com/ This border problem could be specific to my website browser (I use Firefox), but I am not sure. And the border could be added entirely by the browser and there may be no way to get rid of it through coding, but again, I am not sure of this. So, does anyone know if anything can be done to fix this or am I stuck with these dotted borders? Thanks, Jase I'm not sure if this is an IE issue, css, html... I have all icons and images showing a broken image" red X OVER the actual image? I've never seen this on any other sites or even on any other sites i've done. They are all .png images but I use .png files successfully all the time? Anyone encounter this? Here's the HTML surrounding the image file: HTML Code: <div class="header logo2"> <!-- Logo begins here --> <a href="index.php" title=""><img src="images/logo.png" alt="" /></a> </div> <!-- END Logo --> Here's the CSS surrounding the image with no other images or backgrounds being called??? HTML Code: .header { height: 41px; } .logo2 { text-align: right; } See Image Attached... i'm trying to put a transparent png img on a colored background, in IE6 the transparent part of the img appears as a color instead of transparent how can i fix that??? the attached imgs shows how it's appearing in IE6 and FF i am trying to add a border to the image in the following html <div class="text-box"><div class='ecwid-Product'><form> <div style='text-align: center; padding-bottom: 0px;'><script type="text/javascript" src="http://app.ecwid.com/script.js?1059002" charset="utf-8"/></script><script type="text/javascript">xProductThumbnail('productid=10048302');</script></div> <div class='ecwid-productBrowser-head' style='text-align: center; padding-bottom: 0px; font: normal 17px tahoma, geneva, verdana, sans-serif'>725 Originals Blue King of Clubs T-Shirt X Large</div> <div class='ecwid-productBrowser-price' style='text-align: center; padding-bottom: 0px' id='ecwid-price-10048302'>$6.50</div> <table align='center' border='0'><tr><td align='left' class='ecwid'></td></tr></table><div style='text-align: center'><script type="text/javascript" src="http://app.ecwid.com/script.js?1059002" charset="utf-8"></script><script type="text/javascript">xAddToBag('productid=10048302');</script></div> </form></div> i have not been able to get it to work i have added a background color to the html but the image border is giving me problems-any ideas ? ps i dont know html or css code really well so hopefully someone can teach me something new I'm working on a site for my in-laws: shiversbbq.com I made the header and sidebar using slices with photoshop but I want to continue the wood border into the right and bottom of the main content. What is the best way to do this? Thanks!_______________________________ I'm working on a site for my in-laws: shiversbbq.com I made the header and sidebar using slices with photoshop but I want to continue the wood border into the right and bottom of the main content. What is the best way to do this? Thanks! ____________________ Hi, I designed and sliced my website in Photoshop CS4 and then tweaked the code as needed in Dreamweaver CS4. Can someone tell me why the image (seen below) isn't showing up on my company's web page, supposed to be on bottom left of my web page: http://www.majorleaguemotoring.com? I'm guessing it has something to do with the iframe code from Facebook? http://www.majorleaguemotoring.com/i...industries.gif I want to display an imagw which is an Icon. When I view it with IE noi mage. When I view the page with Firefox, it works fine. Does IE require something else? Here is the code I am using. <img src=./graphics/c3.ico HEIGHT="40" WIDTH="40"> Hello All, I am a nubie to HTML. On this website: http://www.shareselfhelp.org/ After the first "Get Free Monthly Meeting Directory by Email" The E shows up. But on the second: "Get Free Monthly Meeting Directory by Email" The E is not visible. It is there, I can click on it. Right next to the word Email. If I click on it and hold the button down, I can see the little square dotted line box, outlining the image, but I can't see the image. Thanks in Advance, Laurence |