HTML - Displays In Ie Fine, Not So Much In Moz.
Hey 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, Similar TutorialsI 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 All, im new here so go easy. this might be an easy answer. i am making this website and am positioning items around the site using div tags. the site looks just how i want it to in Firefox but when i open it in IE it has different sizes everywhere and does not match up. also i have a logo in the upper right of the site. how do i get this to resize when the browser size is changed? here is the sites code. <html> <head> <title>Maroondah Trailers</title> </head> <body BGCOLOR="807a7a"> <div style="background-image:url('pictures/bg.gif'); background-repeat: repeat; position: absolute; left: 0%; top: 0%; width: 16%; height: 97%;"></div> <div style="background-image:url('pictures/bg.gif'); background-repeat: repeat; position: absolute; left: 84%; top: 0px; width: 16%; height: 97%;"></div> <div style="background-color: White; position: absolute; left: 16%; top: 15%; width: 68%; height: 82%;"></div> <div style="background-color: ff3600; color: white; position: absolute; left: 16%; top: 15%; width: 68%; height: 4%;"></div> <div style="position: absolute; left: 60%; top: 3%; width: 30%; height: 40%;"><img src="pictures\logo2.gif"></div> <div style="background-color: black; position: absolute; left: 84%; top: 0%; width: .2%; height: 97%;"></div> <div style="background-color: black; position: absolute; left: 16%; top: 0%; width: .2%; height: 97%;"></div> <div style="background-color: black; position: absolute; left: 0%; top: 97%; width: 100%; height: .2%;"></div> <div style="background-color: black; position: absolute; left: 0%; top: 97%; width: 100%; height: .2%;"></div> <div style="background-color: black; position: absolute; left: 16%; top: 15%; width: 68%; height: .2%;"></div> <div style="background-color: black; position: absolute; left: 16%; top: 19%; width: 68%; height: .3%;"></div> </body> </html> heres what they both look like thanks alot Matt I've been customising templates on a CMS over time, mainly using a Mac for the editing side of things, but then checking on a PC with different browsers, of course. I carried out a few changes a while back and things looked fine in Safari, but not so fine when I checked them on IE7. An example: http://www.ukprwire.com/Detailed/Con...uk_11538.shtml Anyone know why the page is extra wiiiiide in IE, but fine in Safari? I've since checked it with Firefox and its fine with that one too. 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> 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. 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 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> 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 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. 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 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, 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! 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 Uploaded with ImageShack.us My website is www.tuckermatthewsphoto.com This is what my side menu looks like when I open it in Firefox. Note the box to the left of "automotive". It's a link to the home page, just like the "Tucker Matthews Photography" image. I've tried ironing it out all day, caved in and asked for help. In safari the "Automotive" link is in line with the others. Please help! Check my source code and my CSS out! This is killing me! Help. I made this page for a client but he tells me it is misaligned when he browses the page on his mac(both firefox and safari) http://www.freewebs.com/fernandosdesign/detox.html It looks perfectly fine on a pc (firefox and ie) any idea whats happening and how I can correct this issue? Thanks guys http://www.freewebs.com/fernandosdesign/detox.html See http://www.smoli.com I just added the SmoothDivScroll (jQuery add-on) to my page to create scrolling images at the bottom. Unfortunately as a result the table no longer resized correctly to the size of the screen, and the scrolling does not work. This only happens in Firefox, in IE8 everything works as it should. Any idea what is wrong with my code? Many thanks in advance, J. PS: Everything also works fine when previewed from within FrontPage 2k3 (the editor I use to create the page). |