|
HTML - Issue With Ie - Works Fine In Ff
So my site that i am developing has hit a bit of a snag.
In firefox it looks great, however when i switch over to IE i get a big white space. I am wondering if anyone knows how i can correct this white space? http://www.wdwcanada.com/maps.php is the link. Thanks, Similar TutorialsHi 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 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). Hi, Thanks in advance for your help. I'm doing a web page that I would like to be viewed on 1024 resolutions without a horizontal scrollbar. It will contain images that are exactly 980px wide. The problem is that with ie7, as soon as it contains a div or a table, no matter what I do to try to remove all padding,margins,etc.. it adds 2px for each element (I guess 1px for each side). Below is some html as an example of my problem, where I've tried to remove everything I can think of... this works fine in firefox 3 <body style="width:998px;margin-top:0;margin-left:0;margin-right:0;padding:0;"> <div style="width:100%;textalign:center"><table border="0" cellspacing="0" cellpadding="0" style="width:998px;border-collapse:collapse;padding:0;margin:0;border:0;"><tr style="padding:0;margin:0;border:0;"><td style="padding:0;margin:0;border:0;">sdfsdfd</tr></td></table><div style="width:100%> </body> my problem is ie and its padding, ie has add a 4px padding at the bottom of the of the image but in safari and firefox there is no padding. here is the url so u understand what i mean http://nathanoconnor.co.uk/gilbertelectrical/site/ Hi I have tried a lot of things and search the internet for hours regarding this matter... My image background doesn't reapeat in Internet explorer however works fine in any other browsers such as google chrome and firefox. Can you please help me get this fixed? I am new to xhtml and css and really it's really frustrating having this kind of problem. Thank you Website Link: www.pjrazon.co.uk/newlayout/index.html screenshots if it helps: CSS: @charset "utf-8"; * { margin: 0px; padding: 0px; } body { background-color: #CCCCCC; } a:link { color: #ffffff; text-decoration: none; } a:visited {text-decoration: none;} a:hover {color: #b23937;} a:active {text-decoration: none;} #wrapper { width: 1151px; margin-right: auto; margin-left: auto; border-right-width: thin; border-left-width: thin; border-right-style: solid; border-left-style: solid; border-right-color: #999999; border-left-color: #999999; } #wrapper #logo { height: 120px; width: 1151px; } #wrapper #navigation { background-image: url(../images/nav.home.gif); height: 32px; } #wrapper #navigation #navlabel { color: #FFFFFF; padding-top: 5px; padding-left: 125px; } #wrapper #navigation #navlabel #nav li { display:block; width:100px; float:left; list-style:none; } #wrapper #header { height: 391px; background-image: url(../images/welcome.jpg); } #wrapper #mainContent { height: 384px; background-image: url(../images/maincontent.jpg); width: 1151px; } #wrapper #bodyArea #footer { background-image: url(../images/footer.jpg); height: 73px; clear: both; } #wrapper #bodyArea { background: url(../images/bg_bodyarea.jpg) repeat-y; } #wrapper #bodyArea #mainContent #content { display:block; width:400px; float:left; } #wrapper #bodyArea #mainContent #contentwrapper { padding-left: 140px; padding-top: 70px; } HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Perfect Vision</title> <link href="css/layout.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="wrapper"> <div id="logo"><img src="images/header.jpg" alt="logo" /></div> <div id="navigation"> <div id="navlabel"> <ul id="nav"> <li><a href="homepage.html">Home</a></li> <li><a href="profile.html">Profile</a></li> <li><a href="portfolio.html">Portfolio</a></li> <li><a href="contact.html">Contact</a></li> </ul> </div> </div> <div id="header"></div> <div id="bodyArea"> <div id="mainContent"> <div id="contentwrapper"> <div id="content"> <p>August 10 2010</p> <p> </p> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam semper turpis in tortor interdum sed mattis lectus mollis. Pellentesque laoreet quam et mauris feugiat sit amet eleifend turpis imperdiet. Praesent condimentum libero vitae massa imperdiet pellentesque. Vestibulum et risus dolor, ac tincidunt velit. Maecenas lobortis diam tellus. Suspendisse auctor, velit ut imperdiet semper, erat orci pharetra tortor, venenatis vulputate metus eros ut felis. Cras ullamcorper odio sed felis ornare ultricies. Phasellus porta adipiscing aliquet. Aenean ligula tellus, blandit a pulvinar in, fermentum a erat. Sed arcu nisl, porta eu vestibulum at, luctus sed tellus. Aenean eget quam justo, quis ultricies ante. Vivamus tempor sollicitudin augue ut rhoncus. Sed odio mauris, imperdiet ut elementum vitae, dapibus at quam. Nullam in aliquam sem. Fusce consectetur laoreet elit, non consequat nunc tempus nec. Cras at enim ipsum. Praesent ipsum purus, tempus non sagittis volutpat, fringilla eget mi. Maecenas sed elit est. Morbi facilisis purus eget nunc tincidunt iaculis mattis quam pellentesque. </p> <p> Sed tortor leo, laoreet sit amet mattis a, fermentum in ligula. Sed tempor lacus a lorem fermentum fermentum semper nunc sagittis. Vivamus et est porta purus mollis cursus eget in ante. Sed lacinia, diam in tempor suscipit, turpis enim posuere turpis, sit amet vestibulum quam nulla id elit. Vivamus ultricies tempus mi, non consequat velit mollis id. Curabitur vehicula, turpis id tempor condimentum, sem nulla molestie enim, vel commodo metus ipsum non nisi. Aliquam erat volutpat. Fusce venenatis porttitor massa eget suscipit. Sed purus turpis, iaculis id sollicitudin id, vulputate sit amet velit. Suspendisse sed velit non tellus eleifend venenatis vehicula ut elit. Integer sit amet ullamcorper nulla. </p> <p> Vestibulum dictum ante eu nisl ornare tincidunt. Etiam id risus mauris. Duis nec turpis in neque porttitor euismod sed id odio. Sed molestie urna a magna fermentum egestas. Nulla facilisi. Quisque risus neque, sodales pulvinar rhoncus a, lacinia eget neque. Vivamus vel malesuada nisl. Proin mollis tempor felis id dapibus. Morbi velit mi, aliquet sed malesuada et, blandit vitae eros. Nulla nec lorem quam, eu aliquam sapien. Quisque venenatis, enim non ultricies lobortis, lectus dolor consectetur nulla, eu tincidunt metus enim vitae libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent sit amet neque eu libero commodo condimentum. Fusce hendrerit diam sed libero lacinia nec adipiscing massa posuere. Pellentesque eget libero risus, eget venenatis metus. Morbi quis dolor enim. Cras orci orci, ultrices nec consectetur sed, auctor non leo. Aliquam nec sem erat. Nam ut nunc sed leo tempor pretium. Maecenas sit amet tortor a neque congue iaculis eu in ipsum. </p> </div> </div> </div> <div id="footer"></div> </div> </div> </body> </html> http://www.yandina.com/JIndex.htm Open in Firefox, Chrome or Safari - - - that is what it is supposed to look like. Open in IE and the last table get overlaid on top of the previous table. What sort of things can cause that? Additional (unrelated I think) problem, IE is not accessing cookies but others are fine. What can cause that? Hello folks. I have been trying out this site as a beta for a hockey team. I am developing a site and have an issue with ONE page in particular. Every other page looks great! http://web.mac.com/chris.ducasse/force_beta/staff.html That is the culprit. I have looked over the source code, and cannot find anything that would cause it. What happens, if you don't see it, is that the page does not take the entire site width, it wraps the text at about 2 inches or so away from the right edge of the page. Any help is appreciated. Also, I got the navigation bar (modified it myself) from Open Source Web Design and want to give the artist credit - where do I do that in HTML code? Thanks again. I got this little problem, if you view the below page on IE it shows fine, but on FF it shows a space after the flash. http://www.test.muslimways.com Any advice? 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. Help!!!! I have been looking at this for almost 6 hours and I still can't explain why my horizontal menu wrapped using Firefox and not IE. I have firefox 3 installed and some of the categories (on the same tree) wrapped and some doesn't. But if i refresh it a few times, it become normal again. This make no sense. Maybe I need to get some fresh air because i am starting to see spots on the screen. http://208.84.114.15 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! 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, I'm making a website on my mac and when I view it it looks fine, but when I view it on my windows px on 1080x720 res it has everything moved to the right some and even the sizes are wrong. But when I change my res to 1280 x 1080 it looks how it does on my mac (which is 1280 x 800 res). I'm guessing the resolutions are effecting the site's margins and size attributes. Is there a way to fix this? I just started working on creating a website but am having trouble with the navigation on the left hand side. Here is the site: http://www.infinetwebsolutions.com/ The problem is when you go to the "Contact" page and the "About Us" pages the navigation buttons on the left hand side get moved around and don't stay put. I know the reason that it is getting moved around on those two pages alone are because the text is much longer on those two pages (in the right hand table). That text is in a separate table though, so I don't know why it has any impact to the table structure on the left. I don't know if I'm providing enough info here to get any help, so please let me know if I need to give more. Thanks in advance! Here is some of the code if this helps: Code: <tr>
<th height="55" valign="middle" scope="row"><a href="contact.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image13','','Images/nav_bar/contact_selected.jpg',1)"><img src="Images/nav_bar/contact.jpg" name="Image13" width="137" height="41" border="0" id="Image13" /></a></th>
<th width="24" valign="middle" scope="row"> </th>
</tr>
<tr>
<th height="53" valign="middle" scope="row"><a href="about.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image14','','Images/nav_bar/about_us_selected.jpg',1)"><img src="Images/nav_bar/about_us.jpg" name="Image14" width="137" height="41" border="0" id="Image14" /></a></th>
<th width="24" valign="middle" scope="row"> </th>
</tr>
<tr>
<th height="53" valign="middle" scope="row"><a href="clients.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image16','','Images/nav_bar/clients_selected.jpg',1)"><img src="Images/nav_bar/clients.jpg" name="Image16" width="137" height="41" border="0" id="Image16" /></a></th>
<th width="24" valign="middle" scope="row"> </th>
</tr>
Hi guys, I'd really appreciate if someone could please take a look at this site and tell me why I'm getting the alignment issues with some of my divs in internet explorer. Everything looks good in firefox, except that also when the text stretches off the page, the whole site moves to the right a little bit, which I'd like to fix as well. I also just added some span tags but the w3c validator is telling me there's something wrong with it. Could someone suss that one out for me too please? thank you http://www.travellersclinic.com.au/index.html I have recently seen the IE "Error on page" status popping up on my website http://www.bluchip.gg/home. The errors a Line: 322 Char: 7 Error: Expected ':' Code: 0 Line: 45 Char: 8 Error: Exception thrown and not caught Code: 0 Line: 206 Char: 37 Error: Unterminated string constant Code: 0 I'm using Dreamweaver CS3 and I've validated the page and everything is fine. I've looked through the code to find the places specified but all looks fine to me (probably looking in the wrong place! ). These errors come up on all my pages (I'm using a template so I think the errors are in that). Any ideas what is wrong? 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 Hello everyone! Thank you for taking the time to read this. Could anyone please look at my site in IE or FF and tell me how to remove the gap between the table row that has the links at the top and the row that starts the content? The address is http://www.hard2kill.org. I figure it would be less cluttered by leaving the code off of this post and just accessing the page source from the site; however, if you would like me to post it here, I certainly can! When I view it in Chrome, it looks just fine. IE and FF show the gap. Yes, I know using tables this way is bad designing, but I am continually learning more and trying to transition from them, so please leave personal opinions to yourself. If a fix can be made, then I would appreciate your input! I have all the cellspacing, cellpadding, and borders set to 0 so I am at a loss. Thanks in advance! I am building a web site for one of my friends. The address is www.lawlessbullies.com . I can't get the middle section to remain centered on both Firefox and IE. It looks perfect in IE, but not in Firefox. I'm not sure if I need to edit my html, or the css. Can someone take a look and help me out? i've been trying to find a solution for weeks and this is my last resort. Its probably something small, and easy. I'll post my index.html and my style.css |
|||||||