HTML - Displays Very Poorly In Safari
I am an amateur website hack. I did everything in notepad pulling javascript from some free sites. My intention was to have the center image with "Lindsey Teefey" and the bottom page links vertically and horizontally centered on all the pages. I got the pages to look as intended in Firefox and IE, but they look very bad in Safari. I am sure my coding is very amateur and I would appreciate a clean up from an expert.
The pages that I have up a http://www.littlebrindle.com/LT/index.html http://www.littlebrindle.com/LT/photos.html http://www.littlebrindle.com/LT/listen.html (no songs have been added yet) Thanks for any help you can give. Blessings. Similar TutorialsHey all, I'm new here and I have a website i designed. The page appears fine when i go to IE but it's all messed up when I view it using Mozilla. I'm stumped. This is my website: www.secondhandoffroad.com Thanks, I have been working on this website for awhile...all along everyone I checked with says it looks good. I have been doing editing at work and one person said it looked bad. I just thought it was his browser, but of course when I checked it at home -- mine looked horrible too. Almost like my browser isn't listening to the 1028X766 display... Can someone look at my mess of a code and see if I am missing something? Thank you, Todd http://tarrytownvets.com Today I tried to display my website alittle bit differently. no major changes to it but I just made sure the website would be displayed nicely in the middle and that the sides of it would disapear (Click with either firefox or chrome on the link below, to see what I mean) however for some very annoying reason IE does not show the website correctly... while I didn't change the container box that holds the website, other than giving it a piece of the background to hold... and the rest of the code has been working perfectly before in the 3 common browsers (IE, FF, Chrome) Could somebody tell me what I did wrong, or what I should do to make IE display the website correctly? Thanks in advance for the help The website Adress is: http://www.swan10.nl/Test/index.htm Feel free to comment on any of the sourcefiles, regarding improvements, they would be gladly appriciated Hey I am wondering if someone can help me with a little problem, in Firefox my site http://www.fifesouthernrfc.com/1stxv_profiles.html, displays incorrectly.# It should be 2 columns of profiles split into 2 sections by a header. However the second header does not do this, but instead, pushes my 2 columns apart and splits the header in 2. Thanks for looking. I am new at al of this and I just stood up a site and thought everything was going well, it looked great, I validated the code, life was good. until I looked at it in IE. It's WAY messed up! Its got horizontal and vertical scroll bars IN the page, and the tabs I made don't look quite like they are supposed to. I have no Idea how to fix it, I am hoping someone on here can look at my page in IE and look at my code and help me out here. my site is http://pughs.no-ip.org to look at it, and I will post my code he 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> <title> Pugh's World - Freedom of Information </title> <link rel="stylesheet" href="default.css" type="text/css" /> <link rel="shortcut icon" href="i.jpg" type="image/x-icon" /> <script type="text/javascript" src="klappe.js"></script> </head> <body> <table width="100%" cellspacing="0" cellpadding="0" style='background: transparent'> <tr> <td class="clear" width='49%' > </td> <td class="clear" align="center"> <a href="/"><img alt="Pugh's World" src="ilogo.jpg" border="0"/> </a> </td> <td class="clear" width="49%" align="center"> </td> </tr> </table> <div align="center"> </div> <!--TABS--> <table class="mainouter" width="94%" border="1" cellspacing="0" cellpadding="10" align="center"> <tr> <td class="outer" align="center"> <ul id="tabnav"> <li><a href="index.html" class="active">Home</a></li> <li><a href="blog.html" >Blog</a></li> <li><a href="about.html" >About</a></li> </ul> <!--MAIN TABLE HEADER--> <table cellpadding="4" cellspacing="1" border="0" style="width:737px" align="center"> <tr> <td> <table style="width:100%" cellspacing="0" cellpadding="0" border="0"> <tr> <td class="bottom" align="left"> <span class="smallfont"> Welcome to Pugh's! <br/> <font color="blue">Last Blog Post:</font> <font color="darkred">(never) </font> <br /> </span> </td> <td class="bottom" align="right"> <br /> </td> </tr> <!--CONTENT TABLE--> <tr> <td class="bottom"><br /><b>Site is Back Up!</b> - 8-21-2008 18:55:34 </td> </tr> <tr> <td class="bottom"> <table class="main" border="0" cellspacing="0" cellpadding="0" style="width:100%"> <tr> <td class="text"> <p>Well, so far there is absolutely no content, but at least we are back up!<br /> </p> <h1>Check back for updates! </h1> </td> </tr> </table> <br /> </td> </tr> </table> </td> </tr> </table> <br /><br /><br /> </td> </tr> </table> <p class="footer"> ©2008 John Pugh </p> </body> </html> Help me out here, PLEASE SCROLL ALL THE WAY DOWN. ITS URGENT Im making a mail template. Firefox displays the picture, IE won't. It shows it as a empty square with a red X. I cant see what im doing wrong.. i bet its a tiny missing link in some code. Thanks HTML Code: <br /> <p align="center"><img src="koord.jpg" width="170" height="190" /> <br /> 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>Template</title> <style type="text/css"> /* MAAK HEM GECENTREERD Blokjes bovenaan de PSD toevoegen.. 3 onderdelen website maken - TOP - BLOKJES - BOTTOM */ #container{ position:absolute; margin:0 auto; } #pic {position:absolute; left:18px; top:55px; z-index:0;} #txt { font-size:16px; width:410px; position:absolute; text-align:left; font-family:Verdana; left:84px; top:194px; width:600px; z-index:1; } </style> </head> <body> <div id="pic"><img src="template.png" /></div> <div id="txt"> <p><strong><font color="#410d3e">Nieuwsbrief Februari 2010</font></strong> <br /> <br /> Beste Lezer van mijn eerste nieuwsbrief,<br /> <br /> Graag wil ik je opmerkzaam maken op de nieuwste activiteiten van Sessio Communications. <br /> <br /> <p align="center"><img src="koord.jpg" width="170" height="190" /> <br /> <a href="http://www..com">www..com</a></p> <br /> Ik nodig je van harte uit om <a href="http://www..com">mijn website</a> te bezoeken. <br /> Reacties zijn welkom. Doorsturen naar andere belangstellenden mag. <br /><br /> Mocht je geen belangstelling hebben om op de hoogte te blijven van mijn verschillende workshops en trainingen dan kun je dat via onderaan de pagina aangeven. Je e-mail adres wordt dan verwijderd. <br /><br /><br /> Met vriendelijke groet, <br /><br /> Jan M.M. Boesten<br /> <font size="2"><a href="http://www.sessio-communications.nl">www.sessio-communications.nl</a></font><br /> <br /> </div> </body> </html> Hi I'm sure this is simple, but this page http://www.janitorman.net/blueskies/index-1.html shows up OK in IE but not in Firefox. Have I got something wrong? Newbie welcomes some help. Using the following code, if flash is not installed on a computer, while using IE a white box is shown instead of the alternate nested code: HTML Code: <object type="application/x-shockwave-flash" data="Theme/source.swf" width="647" height="61"> <param name="movie" value="source.swf" /> <a href="index.html"><img src="Theme/Banner/Name.gif" /></a><!-- --><a href="index.html"><img src="Theme/Banner/Spacer.gif" /></a><!-- --><a href="http://cart.source-entertainment.net"><img src="Theme/Banner/Logo.gif" /></a> </object> With IE and Flash it displays the flash animation fine, and with Firefox it displays the nested links and images correctly when not using flash, and also displays the flash animation correctly when flash is installs. The only issue is no flash installed on IE. Can anyone explain why this might be happening? Am I missing some IE-specific code? Or is it a problem with my animation? Any help would be appreciated. I have a link from a web page to a page on another server. The link works fine, but the Title at the top of the new page displays the full path as well as the HTML allocated Title. Can anyone advise me how to stop the path being displayed? Thanks Dave I am trying to create the webpage looks like the attached jpg Required Appearance (the image containing the blue rectangle) but it is instead displaying as the attached jpg Actual appearance. I have coloured the relevant code in red. Please tell me why this is happening it seems to be something to do with the <div> tabs. How can I get the two divs display next to each other? Thanks for any help <!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" xml:lang="en" lang="en"> <head> <title></title> </head> <!-- #ab0101 = red --> <body bgcolor="#ab0101" > <div id="header" > <div style ="width: 1000px; height: 140px; margin: auto; background: #ffffff;"> </div> </div> <!-- division that will contain the two divisions--> <div style ="width: 1000px; margin: auto; height:800px; "> <!-- First division ffffff is white--> <div style ="width: 200px; height:800px; background: #ffffff;" > </div> <!-- Second division 000066 is blue--> <div style ="width: 800px; height:800px; background: #000066;"> </div> </div> </body> </html> I'm very new to html and have just started making a website in dreamweaver to build a digital portfolio of design work. The problem is, is that I need my navigation text to be in an exact part of the page (it fills in a section with the table background). When I started making the site it displayed fine in firefox and safari, but not in a few versions of IE I tried. I'm sure there's a solution for this and if anyone could help it would be much appreciated. I've included a link to a test page so you can see what I mean: http://www.digitodd.net/aurora.html Thanks I have a website hosted at discoverybyte.uuuq.com, and it is working great, except that the heading is displayed weird in IE8. It works fine on Firefox 3.5 though. In IE8 the heading menu is indented when I prefer it not to be. See the attached images for more help. Please note that as of this posting the code is on my website shown above. Any help would be appreciated. Hi, I've been working on this page for quite a while: http://www.mymusiclair.com/supporter It displays correctly in Chrome, IE, and FF on my hard drive, but once i upload it it displays wrong in everything except IE. I used FrontPage 2003 to make it... any suggestions? Thanks, Vicky Hello, so basically this summer I took the liberty of making a personal website for myself. I wanted to get to know XHTML and CSS a little bit more over the summer. Getting to my question though, I made a rollover menubar (using photoshop) and everything was going swell until I wanted to get it up and running in my html file. I made a table inserting the non and rollover images and instead of using the massive javascript code block Dreamweaver gave me I decided to use simple "onmouseover/onmouseout" code snippets. When I view it in Firefox it is fully functional but for some reason the rollover images are a little shifted, correct size, but shifted, so there is white space in between the non rollover images. Here's what is looks like: Here is the code for the table/banner (3 rows and 9 columns): Code: -------------------------------------------------------------------------------------------------------- banner_01: large blue block (3 rows merged) left of home banner_02: blue rectangle above home banner_03: vertical blue in between home/blog (3 rows merged) banner_04: blue rectangle above blog banner_05: vertical blue in between blog/misc (3 rows merged) banner_06: blue rectangle above misc banner_07: vertical blue in between misc/contact (3 rows merged) banner_08: blue rectangle above contact banner_09: vertical blue right of contact (3 rows merged) banner_10/banner1_10: home (regular)/home (hover) banner_11/banner1_11: blog (regular)/blog (hover) banner_12/banner1_12: misc (regular)/misc (hover) banner_13/banner1_13: contact (regular)/contact (hover) banner_14: blue rectangle under home banner_15: blue rectangle under blog banner_16: blue rectangle under misc banner_17: blue rectangle under contact -------------------------------------------------------------------------------------------------------- <table align="center" width="925" height="140" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="283" rowspan="3"><img border="0" src="banner_01.gif" width="283" height="140"></td> <td width="134"><img border="0" src="banner_02.gif" width="134" height="16"></td> <td width="23" rowspan="3"><img border="0" src="banner_03.gif" width="23" height="140"></td> <td width="134"><img border="0" src="banner_04.gif" width="134" height="16"></td> <td width="23" rowspan="3"><img border="0" src="banner_05.gif" width="23" height="140"></td> <td width="134"><img border="0" src="banner_06.gif" width="134" height="16"></td> <td width="23" rowspan="3"><img border="0" src="banner_07.gif" width="23" height="140"></td> <td width="134"><img border="0" src="banner_08.gif" width="134" height="16"></td> <td width="37" rowspan="3"><img border="0" src="banner_09.gif" width="37" height="140"></td> </tr> <tr> <td><!---HOME BUTTON---> <a href="home.html"><img border="0" width="134" height="112" src="banner_10.gif" onmouseover="this.src='banner1_10.gif';" onmouseout="this.src='banner_10.gif';"/> </a> </td> <td><!---BLOG BUTTON---> <a href="blog.html"><img border="0" width="134" height="112" src="banner_11.gif" onmouseover="this.src='banner1_11.gif';" onmouseout="this.src='banner_11.gif';"/> </a> </td> <td><!---MISC BUTTON---> <a href="misc.html"><img border="0" width="134" height="112" src="banner_12.gif" onmouseover="this.src='banner1_12.gif';" onmouseout="this.src='banner_12.gif';"/> </a> </td> <td><!---CONTACT BUTTON---> <a href="contact.html"><img border="0" width="134" height="112" src="banner_13.gif" onmouseover="this.src='banner1_13.gif';" onmouseout="this.src='banner_13.gif';"/> </a> </td> </tr> <tr> <td><img border="0" src="banner_14.gif" width="134" height="12"></td> <td><img border="0" src="banner_15.gif" width="134" height="12"></td> <td><img border="0" src="banner_16.gif" width="134" height="12"></td> <td><img border="0" src="banner_17.gif" width="134" height="12"></td> </tr> </table> I hope that the content didn't frazzle anyone, I would just like to fix the display of the menubar as it is fully functional. Thank you very much, JP EDIT: I would also like to make the banner the whole width of the browser but it breaks up the images when I try to do so, just wondering if anyone can figure that out too. Thanks! I am primarily a PPC / offsite SEO guy. My html skills are horrible and I can't do much more than basic text modificaitons using Microsoft Expression Web. One of my clients who has the site: http://www.grandaffairrental.com/ displays correctly in Google Chrome on all pages of the site. However in IE and possibly other browsers on the bottom of the home page the text overlaps and looks like garbage. Similar probelms exist on: http://www.grandaffairrental.com/AboutUs.htm (bottom) http://www.grandaffairrental.com/Services.htm (bottom right) http://www.grandaffairrental.com/PriceList.htm If someone could kindly tell me how to rectify this I'd greatly appreciate the assistance. Thanks in advance. Hello, I am a student and working on a simple first project. All I'm doing right now is writing my code in text edit, saving it as "test.html", and dragging and dropping the file onto Safari/Firefox to view my code. Everything works when I'm at my college's computer lab, but when I'm on my own mac notebook, the files load in the browser as my code. I've tried a variety of samples and checked my preferences, but I can't figure out what I'm doing wrong. Sample code I'm using - <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> <HTML> <HEAD> <TITLE>Simple Link Example 2</TITLE> </HEAD> <BODY> <H1 ALIGN="CENTER">Creating Relative Reference Links</H> <HR> <P>Open <A HREF="practice1.html">Practice 1</A>.</P> <P> Open <A HREF="practice2.html">Practice 2</A>.</P> <P>Open <A HREF="practice3.html" TARGET="_blank"> Practice 3</A> in a new window.</P> </BODY> </HTML> Please help! I'm trying to wrap up an assignment and have been banging my head against the wall all night. Thanks! cordelia Greetings to you all, Today's question I have is this: Does anyone know how to achieve transparency with svg files in Safari? I have an orange colored circle graphic in svg format. I want to display it on a colored background, maybe even an image background but in Safari it shows a white square around the circle. I have tried using the embed tag and the object tag and both show the white square. Both embed and object seem to be fine for Firefox and Opera. I have used img src and this displays the graphic as it should be in Safari but doesn't show at all in Firefox. I have spent the last three hours searching the net for an answer but there doesn't seem to be a solution out there. I would really appreciate some help. I'm sure there must be other people with the same problem. Thanks very much. Hi all! Quick question about the two different browsers, IE and Safari. . . On my home page at www.rentxotic.com I have two buttons programed to be in the top right corner, IE doesn't load this 100% of times, but safari always has it no matter what page your on. Does anyone know what the compatibility issue is with this? How can I fix it? THANKS - Ryan PS all you guys have been such a great help, your time is much appreciated! Ok, this might be simple, but I can't figure it out! I have created a table, which looks great in Safari/Firefox but looks horrid in IE. This screen shot is Safari- http://i239.photobucket.com/albums/f...Picture4-2.png This is IE (looks rubbish, and jumbled up) http://i239.photobucket.com/albums/f...od4/table1.jpg This is the code: <div class="boxout"> <h2><font size="3" face="Verdana" color="white"><i>Drivers Standings</i></font></h2> <br /> <font color="white" size="2" face="verdana"> <u>W P</u> <table border="1" RULES=NONE FRAME=VOID> <TABLE CELLPADDING=5 CLASS="tealtable"> <tr> <td>01 </td> <td>Lewis Hamilton </td> <td>0 </td> <td>0</td> </tr> <tr> <td>02 </td <td>Felipe Massa </td> <td>0 </td> <td>0</td> </tr> <tr> <td>03 </td <td>Kimi Raikkonen </td> <td>0 </td> <td>0</td> </tr> <tr> <td>04 </td <td>Robert Kubica </td> <td>0 </td> <td>0</td> </tr> <tr> <td>05 </td <td>Fernando Alonso </td> <td>0 </td> <td>0</td> </tr> <tr> <td>06 </td <td>Nick Heidfeld </td> <td>0 </td> <td>0</td> </tr> <tr> <td>07 </td <td>Heikki Kovalainen </td> <td>0 </td> <td>0</td> </tr> <tr> <td>08 </td <td>Sebastian Vettel </td> <td>0 </td> <td>0</td> </tr> <tr> <td>09 </td <td>Jarno Trulli </td> <td>0 </td> <td>0</td> </tr> <tr> <td>10 </td <td>Timo Glock </td> <td>0 </td> <td>0</td> </tr> </table> <br /> <p><a href="#"><font color="white" size="2" face="Verdana">Click to see whole table</font></a></p> <font color="white" size="2" face="verdana">W = Wins | P = Points </div> Any ideas? Hi, I recently put up a new website at http://oubeta.org/ . I just realized that it works just fine in Firefox, but not in Safari. Would someone mind taking a peek at the source code of index2.htm (the page you go to after clicking on the main logo, or just he http://oubeta.org/index2.htm). Only the background image shows up in Safari, and none of the other content. Thanks |