HTML - Major Ie7 Problem
My website displays perfectly in all browsers from FF to IE6, but in IE7 all I get is my header image and my main nav bar, and nothing below that, can someone please have a look and see if you can find out why?
here is my 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" xml:lang="en" lang="en"> <head> <title>Fife Southern RFC || HOME || last revised: 17:05 17/06/2008</title> <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Language" content="en-us" /> <meta http-equiv="imagetoolbar" content="no" /> <meta name="MSSmartTagsPreventParsing" content="true" /> <meta name="description" content="Description" /> <meta name="keywords" content="Keywords" /> <meta name="author" content="Colin Burt" /> <style type="text/css" media="all">@import "includes/styles/global.css";@import "includes/styles/menu_hor.css";</style> </head> <body> <div id="fsrfc_container"> <div id="fsrfc_header"> </div> <div id="fsrfc_menu"> <div class="fsrfc_ld"> <ul class="select"> <li><a href="index.html"><b>Clubhouse</b></a></li> <li class="line"><a href="#"><b>The Teams</b><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul class="sub"> <li><a href="1stxv.html">1st XV</a></li> <li><a href="2ndxv.html">2nd XV</a></li> <li><a href="U18.html">Under 18's</a></li> <li><a href="mnm.html">Mini/Midi's</a></li> <li><a href="committee.html">The Committee</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="line"><a href="#nogo"><b>SRU Caledonia League</b><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul class="sub"> <li><a href="fixtures.html">Fixtures</a></li> <li><a href="results/index.html">Results</a></li> <li><a href="league_table.html">League Table</a></li> <li><a href="cup.html">Cup Competitions</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="lrt"><a href="laws.html"><b>Club Laws</b></a></li> <li class="line lrt"><a href="#nogo"><b class="arrow">Team Sheet</b><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul class="sub rt"> <li><a href="U18_ts.html">Under 18's</a></li> <li><a href="2ndxv_ts.html">2nd XV</a></li> <li><a href="1stxv_ts.html">1st XV</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="line lrt"><a href="#nogo"><b class="arrow">News & Events</b><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul class="sub rt"> <li><a href="sbm.html">Stevie Bell Memorial</a></li> <li><a href="sevens.html">Rugby 7's</a></li> <li><a href="disco.html">Disco's</a></li> <li><a href="bbq.html">BBQ's</a></li> <li><a href="clubnews.html">Club News</a></li> <li><a href="clubawards.html">Club Awards</a></li> <li><a href="dinner.html">Annual Dinner</a></li> <li><a href="forum/index.php">The Fish Tank</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif] --> </li> </ul> </div> </div> and the css... Code: .fsrfc_ld { height:35px; width:900px; background:url(../imagebin/ld/black_0.gif); position:relative; font-family:arial, verdana, sans-serif; font-size:11px; z-index:500; } .fsrfc_ld .select { margin:0; padding:0; list-style:none; white-space:nowrap; } .fsrfc_ld li { float:left; background:url(../imagebin/ld/black_1.gif); } .fsrfc_ld li.lrt { float:right; background:url(../imagebin/ld/blue_1.gif); } .fsrfc_ld .select a { display:block; height:35px; float:left; background: url(../imagebin/ld/black_0.gif); padding:0 0 0 15px; text-decoration:none; line-height:33px; white-space:nowrap; color:#cc99cc; } .fsrfc_ld .select li.lrt a {color:#cc99cc;} .fsrfc_ld .select a b { display:block; padding:0 30px 0 15px; background:url(../imagebin/ld/black_0.gif) right top; } .fsrfc_ld .select li.line a b { background:url(../imagebin/ld/black_0a.gif) right top; } .fsrfc_ld .select a:hover, .fsrfc_ld .select li:hover a { background: url(../imagebin/ld/black_1.gif); padding:0 0 0 15px; cursor:pointer; color:#ffffff; } .fsrfc_ld .select li.lrt a:hover, .fsrfc_ld .select li.lrt:hover a { background: url(../imagebin/ld/black_1.gif); } .fsrfc_ld .select a:hover b, .fsrfc_ld .select li:hover a b { display:block; padding:0 30px 0 15px; background:url(../imagebin/ld/black_1.gif) right top; cursor:pointer; } .fsrfc_ld .select li.line a:hover b, .fsrfc_ld .select li.line:hover a b { background:url(../imagebin/ld/black_1a.gif) right top; } .fsrfc_ld .select li.lrt a:hover b, .fsrfc_ld .select li.lrt:hover a b { background:url(../imagebin/ld/black_1.gif) right top; } .fsrfc_ld .select li.lrt a:hover b.arrow, .fsrfc_ld .select li.lrt:hover a b.arrow { background:url(../imagebin/ld/black_1a.gif) right top; } .fsrfc_ld .sub { display:none; } .fsrfc_ld ul ul {display:none;} /* IE6 only */ .fsrfc_ld table { border-collapse:collapse; margin:-1px; font-size:1em; width:0; height:0; } .fsrfc_ld .sub { margin:0; padding:0; list-style:none; } .fsrfc_ld .sub li {background:transparent;} .fsrfc_ld .select :hover .sub { height:25px; display:block; position:absolute; float:left; width:900px; top:35px; left:0; text-align:center; background:#810541 url(../imagebin/ld/fade.gif); border:1px solid #aaa; } .fsrfc_ld .select :hover .rt li {float:right;} .fsrfc_ld .select :hover .sub li a {display:block; height:25px; line-height:22px; float:left; background:transparent url(../imagebin/ld/transparent.gif); padding:0 8px; margin:0; white-space:nowrap; color:#660033;font-size:10px;} .fsrfc_ld .select :hover .sub li.subline a {color:#c00;} .fsrfc_ld .select :hover .sub li a:hover, .fsrfc_ld .select :hover .sub li:hover {color:#000; line-height:20px; position:relative; background:#C12283 url(../imagebin/ld/fade.gif) left bottom;} Thanks for looking. for a live view please visit my site at its temp location of: Here Similar TutorialsSorry if this is in the wrong section, but I couldn't find where to put it. I have installed 2 wordpress blogs on over the last few months and they both have the same problem. I can write posts, but I cannot format them at all. If I do so, it doesn't publish. It just takes me back to the index page. you can login he http://waynerooneyonline.com/wordp/wp-login.php to see what I mean. user: test pass: test any help would be greatly appreciated. hey guys, Long time viewer, finally got around to joining. I have a huge issue, that i am hoping someone here, or some of you can give me options of doing what i want to do.. also i hope i posted in the right area. Ohkay, so my website consist of a frame, which is about 25% of the window, 75% of the remaining being the main body. I am trying to view a large website, such as facebook within my frame. so basically, my problem is, when i do this, facebook will not function within my 75% of my main body, instead, when i try to log in, it leaves my website/frame, and goes to the www.facebook.com. Is it possible to get around this encryption? API? Perhaps using 3 legged oauth? PLEASE HELP ME! Appreciate ANY anythings you MAY think will work! thanks guys! Hi I have just finished editing a webpage for a compay and sent it to a html validator to clean up the code a bit. Now i have done this though and made the changes whenever i try to open the page in IE all it shows is an empty page with no errors. The page displays fine in firefox but i have no idea what i have done. The link is: www.bgp-group.co.uk/ben/index2.htm Thanks in advance i need major help with my fan site. i'm trying to set up word press so it looks pretty, and will work on my site my site currently only works in fire fox and i have no idea why. my site; garageglamorousgaga.freehostia.com my word press keeps showing a bunch of the same stories when all i need is 1 of each also i need help with customizing each to match my site, and to make it a white box around each of them with each story/post ahh i actually need to help, some one fix my wordpress What do I major in if I want to study computer programming and website design? Ok here goes... basicly I have an issue with my website... (www.kingstonian.webs.com). The index page is all their & stuff but when I try to edit the HTML for another page, I can't quite get it to do what I want it too. I'm not the best at explaining things but here goes: Basicly if you look at the source for my site, I want to turn everything under the 'Kingstonian TV' banner & above that thin white strip near the bottem into ONE TABLE CELL. For the life of me I have tried to do this but every time it completely stuffs up the page. Sends all the table rows & coloumns everywhere. If anyone can spare the time to have a look at it & if at all possible (a bit cheeky i know) sort me out with the correct code for the page I would be very appreciative! Please tell if these markup validation errors can be fatal? Thanks. I was not able to extract a character encoding labeling from any of the valid sources for such information. Without encoding information it is impossible to reliably validate the document. I'm falling back to the "UTF-8" encoding and will attempt to perform the validation, but this is likely to fail for all non-trivial documents. Read the FAQ entry on character encoding for more details and pointers on how to fix this problem with your document. No DOCTYPE found! Attempting validation with HTML 4.01 Transitional. The DOCTYPE Declaration was not recognized or is missing. This probably means that the Formal Public Identifier contains a spelling error, or that the Declaration is not using correct syntax. Validation has been performed using a default "fallback" Document Type Definition that closely resembles "HTML 4.01 Transitional", but the document will not be Valid until you have corrected this problem with the DOCTYPE Declaration. Learn how to add a doctype to your document from our FAQ. This page is not Valid (no Doctype found)! Below are the results of attempting to parse this document with an SGML parser. 1. Error Line 2 column 0: no document type declaration; implying "<!DOCTYPE HTML SYSTEM>". <HTML> The checked page did not contain a document type ("DOCTYPE") declaration. The Validator has tried to validate with a fallback DTD, but this is quite likely to be incorrect and will generate a large number of incorrect error messages. It is highly recommended that you insert the proper DOCTYPE declaration in your document -- instructions for doing this are given above -- and it is necessary to have this declaration before the page can be declared to be valid. ✉ 2. Error Line 8 column 74: required attribute "ALT" not specified. ..."><img src="images/wl468v2.gif" width=800px></span> </div> The attribute given above is required for an element that you've used, but you have omitted it. For instance, in most HTML and XHTML document types the "type" attribute is required on the "script" element and the "alt" attribute is required for the "img" element. Typical values for type are type="text/css" for <style> and type="text/javascript" for <script>. ✉ 3. Error Line 9 column 58: required attribute "ALT" not specified. <div id="links"><img src="images/lotto_04.jpg" width=800px></span> ✉ 4. Error Line 9 column 65: end tag for element "SPAN" which is not open. ...s"><img src="images/lotto_04.jpg" width=800px></span> The Validator found an end tag for the above element, but that element is not currently open. This is often caused by a leftover end tag from an element that was removed during editing, or by an implicitly closed element (if you have an error related to an element being used where it is not allowed, this is almost certainly the case). In the latter case this error will disappear as soon as you fix the original problem. If this error occured in a script section of your document, you should probably read this FAQ entry. ✉ 5. Error Line 22 column 39: end tag for "FONT" omitted, but its declaration does not permit this. <input type="submit" value="Login"></td></tr> * You forgot to close a tag, or * you used something inside this tag that was not allowed, and the validator is complaining that the tag should be closed before such content can be allowed. The next message, "start tag was here" points to the particular instance of the tag in question); the positional indicator points to where the validator expected you to close the tag. ✉ 6. Info Line 20 column 0: start tag was here. <font size="2">Remember me next time 7. Error Line 32 column 3: document type does not allow element "H2" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag. <h2>Tired of Losing?</h2> The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element. One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>"). ✉ 8. Error Line 33 column 2: document type does not allow element "P" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag. <p>Do you buy horses? ✉ 9. Error Line 49 column 7: document type does not allow element "TABLE" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag. <table><tr><td>Level </td> <td># of Members</td> <td>Commission</td> <td>Total ✉ 10. Error Line 64 column 47: required attribute "ALT" not specified. <img src="images/horse_12.jpg" width=800px> deleted cos im stupid I decided to make a website for a final project in my Theatre History course, since web designing used to be one of my biggest hobbies. I started this and realized I was working off of the codings I taught myself in 2001ish. So, I am having some problems. The website I have is here : http://romantheatre.freezoka.com . I wanted to put two iframes on the site, one wider one on the left hand side of the gray area to display the information and then one on the right hand side to put the links. The problem I am encountering is that I do not want the frames to be anchored in the top right corner, which seems to be where they are staying. I remember using a code that went something like top="number" left="number" and that shifted the frame down and to the right, but it won't work and every time I search for it nothing about that comes up. I've recently seen people suggesting I try an alternative, so I was wondering if anyone here has a suggestion as to how I shift the iframes or an alternative I could look up a tutorial of online. Thanks in advance! Hi was wondering if anyone could help me in the right direction with html emails? I'm not doing something right and I dunno what it is! AGH! Anyhoo, would really appreciate your help if you can spare a mo.... I am issued with a .pdf, which I need to re-create as an html email. The graphics ned to look the same, and I have to make the text editable, so I have split the image into a table, which, when tested in Firefox, Explorer and Safari, work just splendidly! The table is only 600px wide, as I hear that emails should be no wider than 650. All the links work, there is no padding on any of the cells and the page displays perfectly in all browsers. However.... when the client put its on their server, customers who have hotmail, gmail or outlook7 accounts see a displaced image... the table is everywhere and is filled with white-space! Everything has to be built in plain HTML. I am not able to use styles, as the clients server does not support them. Does anybody have any idea what could be happening? If you need more info, I will do what I can to help! Thanks In Firefox, it's fine -- In IE, the two lines separating the columns are slightly larger than they should be (see circled in attached image). Like I said, it's nitpicking, but it's something I'd like to fix Home Page: http://img682.imageshack.us/img682/5672/homezq.gif All Other Pages: http://img3.imageshack.us/img3/8905/othero.gif Hello I'm new to doing websites but recently I have come to understand that particularly Internet Explorer has lots of issues! I realized this after a design that I had evolved mainly testing between Firefox and Safari just went retarded in Internet Explorer, and now I'm not sure what to expect. Can anyone outline the main issues that set IE apart? And whether there is a way to circumvent them? Because for everything I've tried so far Firefox Safari and Omniweb all behave predictably and relatively the same. Thanks- Frustrated Fishpaws i run a couple of norwegian webshops, and they all use the same backend, developed by myself. however im not using any kind of subversion system, and this sucks right now. check this link to one of my product-pages in your regular browser (not IE. i presume you use chrome or firefox) http://iphonedeksler.no/iphone-og-ip...0mah-sort.html then test it in IE, it looks like a complete mess, and its not possible to use the site at all. i recently made it W3C validated, but i think this error came after that. can anyone see what in the name of the lord is wrong in internet explorer?! I would like to have an image that takes 2 url like the following image... is it possible? if so, can someone please tell me how this could be done? Thank you very much.. NOTE: I tried doing this... <map name= 'url1' > <area shape= 'poly' coords= ' 0 , 0 , 50 , 0 , 0 , 50 ' href= 'url1.html' > </map> <a href= 'url2.html' > <img src= 'img.jpg' width= 50 height= 50 usemap= '#url1' > </a> but this only get 'url1' woring... Okay, I know that this problem is going to be really really easy, but I forgot how to do it. I use to own an older website and forgot the code. Anyways, I only know how to describe it. When I minimize the screen, it is minimizing the whole thing and collapsing it making the iframes smaller and the text fit into a smaller space. Most websites have a code (i don't know what it is) so that when someone minimizes their browser, it just makes the browser smaller and not the actual page. Here's what it looks like: http://www.freewebs.com/noeylani94/index.htm Try minimizing that and see how it looks. It collapses the whole page right? Can someone tell me the code how to fix it? Thanks =D Hello Here i am asking another question :S , anyways i need some help ! so installed SMF (smiple machine forums) to my site and i want to get this slider running http://www.bluedevilcustoms.com/comm...pic,182.0.html There is a guide there but i do not understand as i am learning the basics of web designing at the moment :/ can some one tell me what exactly i have to do here or do it for me ? (Sorry im asking for too much) But i need some help fats PS-You can pm me if you wanna do it for me Thanks a lot Hashen Hello, I am fairly new to web programming, and I have taken over the web administration at my work. The page I am working with is an absolute mess, but I have one bug that I just cannot figure out for the life of me. It is an overlap problem, where one of the tables overlaps the one to the right of it, even though there doesn't seem to be anything "pushing" it out further, like unwrappable text or anything like that. It only occurs in IE/Win, I have viewed in both versions 6 and 7. If anyone could give me any suggestions, I would greatly appreciate it. URL: http://www.yonasmedia.com Reference: http://jlmechanicals.com/index.php So if you use IE 8 or FF, page loads as it should. Now, in IE 7: If you look in between the red and gray boxes, you will notice that there is a horizontal double gradient (that gradient is absent above and below the red boxes). The horizontal double gradient is set as the background for the <body> tag with repeat-y. Now, you need to look REALLY CLOSELY, in IE 7 only, at the very very bottom of the page, you will notice that the horizontal gradient produced by the background image for <body> is there (if you don't see it look closely, it can blend in really well with the bottom toolbar of internet explorer depending on what your color scheme is). Bottom margin for <body> is set to 0, and all other browsers obey except IE 7. So how do I fix this in IE 7? Thanks! Im trying to get an image above my buttons but its not working .. It works when i do Code: <center> <img src="http://i226.photobucket.com/albums/dd131/kutakun/profile-1.png" width=600 height=100 border=0 alt="" title=""> </center> But shouldn't the css i made do it for me? HTML CODE ( Profile.html) Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head><title>Profile</title></head> <head> <link href="myStyle.css" rel="stylesheet" type="text/css" media="screen" /> </head> <style type="text/css"> <!-- body { background-color: #669999; background-image: url('http://i226.photobucket.com/albums/dd131/kutakun/backgound2.png'); background-repeat: no-repeat; background-position: center; background-position: top; #nav td {vertical-align: top; width: 94px; height: 42px; padding: 0px; margin-top: 150px;} #nav {padding: 0px; margin: 0px auto; border: none; text-align: center;} } --> </style> </head> <!-- MENU BAR --> <table id="nav"> <tr> <td> <div style="margin-left: 285px; margin-top:150px; padding: 0px;"><img src="images/home.png" alt="" border="0"></div> <td> <div style="margin-left: 20px; margin-top: 150px; padding: 0px;"><img src="images/gallery.png" alt="" border="0"></div> <td> <div style="margin-left: 20px; margin-top: 150px; padding: 0px;"><img src="images/support.png" alt="" border="0"></div> <td> <div style="margin-left: 20px; margin-top: 150px; padding: 0px;"><img src="images/contact.png" alt="" border="0"></div> <td> <div style="margin-left: 20px; margin-top: 150px; padding: 0px;"><img src="images/forum.png" alt="" border="0"></div> </td> </tr> </table> </body> </html> CSS CODE ( myStyle.css ) Code: #logo { width: 600; height: 100; background: url(http://i226.photobucket.com/albums/dd131/kutakun/profile-1.png) no-repeat; } |