HTML - <img> Using Png Doesn't Display
I am using IE and for some reason PNG images specified using an <img> tag display blank. I know the files exist as there is no 'X' where the image is supposed to be but I can't see them. If I change to using a JPG then the images appear.
My code is extremely simple and looks like: Code: <html><body><img src="images/test.png"></body></html> I have tried using width and height parameters but it only changes the size of the blank area. Does the <img> tag support PNG images? Is there some other reason why the images display blank? Similar TutorialsHei! I'm trying to create a table with three columns, first and last with one row each and middle with two rows. There's pictures in left, right and in the middle bottom cell. Here's the code: Code: <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td width="16%" colspan="1" rowspan="2"><img src="kuvat/hat-right.jpg" border="0" width="100%" height="100%" alt="-------"> </td> <td width="64%" align='center'><a href="index.php">Main page</a> | <a href="aboutus.php">About Us</a> | <a href="showprods.php?sizeToShow=All">Catalog</a> | <a href="contacts.php">Contacts</a> </td> <td width="16%" colspan="1" rowspan="2"><img src="kuvat/hat-left.jpg" border="0" width="100%" height="100%" alt="----"> </td> </tr> <tr> <td width="64%"><img src="kuvat/hat1.jpg" width="100%" height="100%" alt="---------"></td> </tr> </tbody> </table> It works like I want it to do in Firefox, looks ugly in Konqueror and not displayed in Internet Explorer 6. Where's the problem? Thanks in advance! Hi there, I was wondering if someone could provide some help. I have designed/built a website, and for some reason - the "Flash" content doesn't always display in Internet Explorer 7+ Some pages do display the Flash, some pages dont. The website is www.shiftingsandsarabians.com.au Chrome, Safari & firefox all display correctly. It just seems to be Internet Explorer. The "Flash" content is displayed at the top on each page. Would appreciate any help. Thanks guys, -Brad I have a page on my web site that isn't displaying correctly. I've used the same template for all the pages - but for some reason this single page won't display correctly on foxfire, but fine on IE -- you can reach the page Here: I need the page to fit the screen display - but for some reason this page won't. I would be greatful for any help Thanks I have a wordpress blog in which on the single post page the container div is non-existent and the sidebar and footer go into the content div. The page displays fine in firefox it only has the problem in internet explorer. Any help would be greatly appreciated. Here is an example of the problem: http://purplemushroomreviews.com/gam...mption-review/ I am building a website in dreamweaver cs3. It displays normal in all browsers except an older version of IE (I think 6.0). I have read a bunch and have learned about float left and left margin problems with older IE versions. Nothing has helped so far. To make a long story short if you view http://whatwowart.com the right column where you sign up for newsletter etc. gets put under the whole page in older IE (I think 6.0). If someone could please help me I would really appreciate it. Thanks, John O Code can be seen at: http://whatwowart.com/code.html The title says it all, my site just doesn't properly work in safari. heres the link www.royaltee-design.com help would really be appreciated thanks I've got three drop-down lists in a navbar that displays properly in IE but not in Firefox or Sea Monkey. I can't figure out what I'm doing wrong. The lists under "Historic District" and "Take Action" are fine, but the two items under "Blog" don't show up in FF or SM. The "Blog" links are external. Would that matter to FF and SM? The WC3 turned up the likely error, but when I added and/or removed a ul and/or li tag, I got strange results and was unable to fix the problem. If someone can explain what I should do and why I'd appreciate it. WC3 flagged the <ul> tag after <li><a href="http://west80s.blogspot.com/">Blog</a></li> because: "document type does not allow element "UL" here; assuming missing "LI" start-tag" Here's the site: http://west80s.org/ Here's the code: Code: <ul class="NavHoriz-menu"> <li class="first"><a href="index.htm">Home</a></li> <li> <a href="http://">Historic District</a> <ul> <li class="first"><a href="Historic-District.htm">Proposed District</a></li> <li><a href="letters-index.htm">Support the Historic District</a></li> <li><a href="GB-pix.htm">Gilbert Brownstones</a></li> <li><a href="WestPark.htm">West Park Church</a></li> <li><a href="330-W-86-St.htm">330 W 86th St</a></li> </ul> </li> <li><a href="http://west80s.blogspot.com/">Breaking News</a></li> <li><a href="http://">Take Action</a> <ul> <li class="first"><a href="hydrofracking.htm">Hydrofracking</a></li> <li><a href="letters-index.htm">Support the Historic District</a></li> </ul> <li><a href="MembershipForm.htm">Join</a></li> <li><a href="mailto:info@west80s.org">Contact Us</a></li> <li><a href="http://west80s.blogspot.com/">Blog</a></li> <ul> <li class="first"> <a href="http://west80s.blogspot.com/2011/07/please-help-us-wipe-out-graffiti-this.html">Graffitti Removal</a></li> <li><a href="http://west80s.blogspot.com/2011/07/weve-adopted-tree.html">Beautificaiton</a></li> </ul> </li> </ul> Thanks for any help. Ellen Hi guyz, i have a query Mouse over the datagrid cell display tooltip or panel to display information but only using HTML and CSS not using javascript. can anyone help me. because im gonna use it on htmleditor on c# desktop application thax before I am using Kompozer to build a website for my business. It looks great in Firefox: But it has problems in IE: Anyone have any suggestions? Thanks, Hi, I need help I tried to check the code of my website it works perfectly well in google chrome and firefox but not in Internet explorer. i tried your suggestions but still it doesn't work. I am scaling the blue div based on the size of the red div, but also the size of the green div, and i just can't wrap my head around the right statement to make this happen. It can never be shorter than the green div, but needs to be as long as the red div... when the red div is longer than the green div. i tried this Code: <link rel="shortcut icon" href="favicon.ico"> ..this Code: <head> <link rel="icon" href="favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /> </head> & this Code: <link rel="shortcut icon" href="favicon.ico" type="image/vnd.microsoft.icon"> <link rel="icon" href="favicon.ico" type="image/vnd.microsoft.icon"> it all work on firefox but not on IE6 (i don't know if it does on IE7) any ideas plz thnx in advance After the "marital status" and "sex" are selected, I want to assign a default value to the "Title" field. I think I am calling the function DefaultTitle incorrectly because I am not even seeing the initial alert box. Any suggestions? function DefaultTitle(strng,x) { alert("Checking Title."); var Sex=documet.PatientEntry.personal_sex.value; var MaritalStatus=strng; if (Sex=="Female" && MaritalStatus=="Married") {document.PatientEntry.personal_Title.value="Mrs."; HighlightWhite(x); Return; } if (Sex=="Male") {docment.PatientEntry.personal_Title.value="Mr."; HighlightWhite(x); Return; } if (Sex=="Female" && MaritalStatus=="Single") {document.PatientEntry.personal_Title.value="Miss"; HighlightWhite(x); Return; } if (Sex=="Female") {document.PatientEntry.personal_Title.value="Ms."; HighlightWhite(x); Return; } } Sex: <SELECT name="personal_sex" id="personal_sex" tabindex=7> <OPTION>Male</OPTION> <OPTION>Female</OPTION> </SELECT> Marital status: <SELECT name="personal_MaritalStatus" id="personal_MaritalStatus" onmouseout="DefaultTitle(this.value,this.id)" tabindex=8> <OPTION>Married</OPTION> <OPTION>Single</OPTION> <OPTION>Separated</OPTION> <OPTION>Divorced</OPTION> <OPTION>Widow(er)</OPTION> </SELECT> Title: <SELECT name=personal_Title tabindex=9> <OPTION>Mr.</OPTION> <OPTION>Mrs.</OPTION> <OPTION>Ms.</OPTION> <OPTION>Miss</OPTION> <OPTION>Dr.</OPTION> </SELECT><BR> Hi, I made a sliced up header in Photoshop and then created rollovers in dreamweaver. It works great on IE and on Firefox, but at the top of Chrome the top few pixels are shifted way to the left. Why would this happen just in Chrome and how can I fix it? The site is http://www.socalstandup.com/ Thanks a lot! I'm completely baffled. I have a contact form on this website: http://www.waldronforest.com/ that works just fine when I test it in FireFox, but when I try to use it in internet explorer I can't even click on the fields. Anyone have any idea why? Thanks! I made two style sheets for my project. First one is style.css, and the scond one is ie6.css which is intentionally left blank. This latter (ie6.css) is, ofcourse, made specialy for IE6 and in HTML head section I put
Code: <!--[if lt IE 7.0]> <link rel="stylesheet" type="text/css" href="ie6.css" /> <![endif]--> I can't realise what's wrong, since when I preview site in IE6 it acts like conditional statement is not there. It should display page with no style, but still the page is displayed with style.css styling. You can check it out on: http://www.byethost.com/ for page is very simple. Thank's in advance! Hi, i want to open a new popup window after the link is pressed. HTML Code: <script type="text/javascript"> <!-- function openPopup (url, speed) { var w, h; if (speed == 'dsl') { w = 640; h = 520; } else if (speed == 'isdn') { w = 320; h = 280; } window.open(url, "Garden-Hotel", "toolbar=no, location=no, status=no, scrollbars=no, titlebar=no, directories=no, menubar=no, resizeable=no, width="+w+", height="+h); } --> </script> ... <a href="movies/gh_german_wmv_dsl.html" onclick="window.openPopup(this.href, 'dsl'); return false;">Mediaplayer (nur IE)</a> IE 7 just opens the link in the same browserwindow, although javascript is activated. Anybody knows why? Thanx... p-flash I'm trying to get this form from this food site to align just like the one I did for this Insurance site but doesn't seem to work. What is the problem? Morning guys, So yeah I'm new, this is my first ever site. After so much trial and error with Dreamweaver (so frustrating but a great way to learn) i have finished the first draft of the site and have uploaded it to the iPower server so my bosses can review. In Dreamweaver the preview in browsers show everything is fine, but live this is not the case (how many times have you heard this?!) Good thing is it's not the positioning thats the issue - it's the images - some load up, some don't, and this seams to change everytime I refresh?!?! Surely this is a case of not me but them?! He's a link so you can have a look yourselves: http://www.friendshiprose.com/cruise_tobago.html If anybody can shed some light it would be much appreciated, as I don't know too much really. Kind regards, Simon Heres the source code to my site if it interest you: (please be kind - first site n all!) 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" /> <title>Untitled Document</title> <link href="../tester.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> <!-- function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } //--> </script> <style type="text/css"> <!-- a:link { color: #099; text-decoration: none; } a:visited { text-decoration: none; color: #099; } a:hover { text-decoration: underline; color: #0CC; } a:active { text-decoration: none; color: #0CC; } --> </style></head> <body onload="MM_preloadImages('../Images/RoselinkRoll.jpg','../Images/GIVRoll.jpg','../Images/RealRoll.jpg','../Images/WeddingsRoll.jpg','../Images/SRERoll.jpg')"> <div id="ContainerMain"> <a href="http://www.friendshiprose.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('FR','','../Images/RoselinkRoll.jpg',1)"><img src="../Images/Roselink.jpg" alt="Friendship Rose Caribbean Schooner" name="FR" width="160" height="97" border="0" class="TopNav" /></a> <a href="http://www.grenadinevillas.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('GIV','','../Images/GIVRoll.jpg',1)"><img src="../Images/GIV.jpg" alt="Grenadine Island Villa Rentals" name="GIV" width="160" height="97" border="0" class="TopNav" /></a> <a href="http://www.grenadineproperty.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('RE','','../Images/RealRoll.jpg',1)"><img src="../Images/Real.jpg" alt="Grenadines Land & Villa Sales" name="RE" width="160" height="97" border="0" class="TopNav" /></a> <a href="http://www.grenadineweddings.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('WED','','../Images/WeddingsRoll.jpg',1)"><img src="../Images/Weddings.jpg" alt="Grenadines Weddings & Events" name="WED" width="160" height="97" border="0" class="TopNav" /></a> <a href="http://www.sailrelaxexplore.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('SRE','','../Images/SRERoll.jpg',1)"><img src="../Images/SRE.jpg" alt="Sail Relax Explore the Grenadines" name="SRE" width="160" height="97" border="0" class="TopNav" /></a> <img src="../Images/collection_large.jpg" width="160" height="30" alt="Grenadines Collection" id="Collection"/> <img src="../Images/Friendship_Rose_Header.jpg" width="880" height="175" alt="Friendship Rose Caribbean Schooner" id="Header" /> <div id="LeftNav"><img src="../Images/Day Cruises Tab1.jpg" width="160" height="143" alt="Contact Us" id="Contact" /> <p> </p> <p> <a href="http://www.friendshiprose.com/cruises.html">Cruises</a></p> <p> <a href="http://www.friendshiprose.com/experience.html">The Experience</a></p> <p> <a href="http://www.friendshiprose.com/menu.html">Menu</a></p> <p> <a href="http://www.friendshiprose.com/locations.html">Locations</a></p> <p> <a href="http://www.friendshiprose.com/construct.html">Private Cruises</a></p> <p> <a href="http://www.friendshiprose.com/weddings.html">Weddings</a></p> <p> <a href="http://www.friendshiprose.com/construct.html">Image Gallery</a></p> <p> <a href="http://ical.mac.com/WebObjects/iCal.woa/wa/default?u=thegrenadines&n=Friendship%20Rose%20Cruises.ics">View Sailing Calendar</a></p> <p> <a href="http://www.friendshiprose.com/contact.html">Contact Us</a></p> </div> <div id="maincontentCaysCruise"> <h1 class="H1Text"><b>THE TOBAGO CAYS - FRIENDSHIP ROSE CRUISE</b></h1> <p class="LineSpace"> </p> <P class="StandTextGap">The <a href="http://www.friendshiprose.com/tobago_cruise.html">Tobago Cays Marine Park</a> is an stunning group of uninhabited islands near the southern end of the Grenadines. With fine coral reefs, turquoise waters and golden sand, many people consider the Tobago Cays to be the “Jewel in the crown” of the Grenadines. For more information on the amazing Tobago Cays <a href="http://www.friendshiprose.com/tobago_cays.html">click here . . . </a></P> <p class="LineSpace"> </p> <h2 class="H2Text"><font size="3"><b>Cruise Itinerary</b></font> </h2> <p class="LineSpace"> </p> <p class="StandTextGap"><b>7:00am</b><br />Join the Schooner, welcomed onboard by Captain and Crew<br /> Coffee & breakfast served as you sail by Moonhole and the Western Isles Of Bequia<br /> Enjoy the voyage through the Grenadines with excellent on board service</p> <p class="LineSpace"> </p> <p class="StandTextGap"><b>10:00am</b><br /> Arrive in the Tobago Cays<br /> Snorkel the coral reef <br /> Explore a deserted island<br /> Swim with turtles just off the pristine coral sand beach</p> <p class="LineSpace"> </p> <p class="StandTextGap"><b>1:00pm</b><br /> Lunch served on the shaded deck<br /> Relax in a hammock under billowing sails <br /> Have a relaxing afternoon swim from the boat</p> <p class="LineSpace"> </p> <p class="StandTextGap"><b>2:30pm</b><br /> Set sail for Bequia<br /> Watch for dolphins and turtles from the bow sprit <br /> Take afternoon tea and cake or enjoy the sundowners</p> <p class="LineSpace"> </p> <p class="StandTextGap"><b>5:30pm</b><br /> Arrive in Bequia</p> </div> <div id="SocialButtons"> <a href="http://www.facebook.com/home.php?ref=home#/group.php?gid=183257088849&ref=ts"><img src="../Images/join-our-facebook-group.jpg" width="160" height="46" style="border:0" alt="Facebook Group"/></a> <img src="../Images/twitter_logo.jpg" width="160" height="46" alt="Twitter Follow" id="Twit" /> </div> <img src="../Images/Footer 1.jpg" width="160" height="97" alt="Friendship Rose" class="FooterImgs"/> <img src="../Images/Footer 2.jpg" width="160" height="97" alt="Friendship Rose" class="FooterImgs"/> <img src="../Images/Footer 3.jpg" width="160" height="97" alt="Friendship Rose" class="FooterImgs"/> <img src="../Images/Footer 4.jpg" width="160" height="97" alt="Friendship Rose" class="FooterImgs"/> <div id="ContainerBot" align="left"> <h1 class="H1Text">The Friendship Rose Caribbean Schooner </h1> <h2 class="H2TextGap">Day Tours & Private Charters Through the Grenadines</h2> <h3 class="StandText">Bequia, St. Vincent & the Grenadines, West Indies</h3> <p class="StandText">E-mail:<a href="mailto:friendshiprose@mac.com">friendshiprose@mac.com </a> </p> <p class="StandText">Tel BEQUIA: +1 (784) 495 0886/9 +1 (784) 457 3888 +1 (784) 457 3739 UK FREEPHONE 0800 0484814</p> </div> </div> </body> </html> Okay I have tested the following code in all browsers and IE is the only one that it doesn't work for for .html pages. It does work for .asp pages though. I do not want to use iframes. Any suggestions? <object type="text/html" height="100%" width="100%" data="http://www.websitename.com"> </object> |