Small html error = huge problem

I'm coding my layout and it seems their is a huge gap at the bottom... underneath the image. Go Here: <!-- m --><a class="postlink" href="http://www.everlasting-misery.com/christopher/html/main.html">http://www.everlasting-misery.com/chris ... /main.html</a><!-- m --> in 800x600 resolution. There is a gap underneath the image at the bottom as you can see.. how do I fix that error?<!--content-->I looked but I have no idea what gap you are refering to.<!--content-->The gap at the bottom of the page, where the main image ends I want the page to end at that, not a bit of empty space :(<!--content-->Your problem might lie in part in the last line of your code:<p><iframe name="main" src=http://www.htmlforums.com/archive/index.php/"outwit-frame.html" noresize frameborder="0" border="0" width="670" height="435"><>Try putting /p into that empty tag at the very end.<br />
<br />
However, I suspect that you will still end up with some "white" space at the bottom of the page by default.<br />
<br />
Also, it's worth pointing out that your iframe does NOT center between the two fancy borders you created down the page in a screen res of 1024x768. I think that is a much bigger problem than the one you're worried about.<br />
<br />
Neil<!--content-->There are minor errors and missing tags in the code (<!-- m --><a class="postlink" href="http://validator.w3.org/check?uri=http%3A%2F%2Fwww.everlasting-misery.com%2Fchristopher%2Fhtml%2Fmain.html&charset=%28detect+automatically%29&doctype=HTML+4.01+Transitional&ss=&sp=">http://validator.w3.org/check?uri=http% ... al&ss=&sp=</a><!-- m -->) that you might like to correct.<br />
<br />
You can ignore all of the errors like: Error: there is no attribute "foo" for this element (in this HTML version) unless you want to get into CSS.<br />
<br />
You haven't yet got a DOCTYPE, Content-Type, Content-Language, Keywords, Description, or any other META tags within the HEAD section.<!--content-->I'm not sure what you mean. See attahed to clarify, or did I not wait long enough for the page to loead - the loading time is too long, reduce your main image.<!--content-->It is possible that this is an error that appears in some browsers but not in others. Perhaps it would make things easier if people actually said what browser they have used to view the page, the version number, as well as the screen resolution and colour depth.<br />
<br />
There are some missing and wrongly nested tags (<!-- m --><a class="postlink" href="http://validator.w3.org/check?uri=http%3A%2F%2Fwww.everlasting-misery.com%2Fchristopher%2Fhtml%2Fmain.html&charset=%28detect+automatically%29&doctype=HTML+4.01+Transitional&ss=&sp=">http://validator.w3.org/check?uri=http% ... al&ss=&sp=</a><!-- m -->) in the code. It may be this that affects the view.<!--content-->The gap I am refering to is underneath main-image.jpg . Phantom phil that is not the gap I am refering too. <br />
<br />
I have come to the conclusion that the error is somewhere within the iframe code.<br />
<br />
I still don't know exactly what is wrong with that, but that is somehow causing the problem at the bottom :(<!--content-->anyone??? :(<!--content-->Your whole page is a mess as far as coding goes, however, here's a quick and very dirty fix that breaks most of the rules: <br />
<br />
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><br />
<br />
<HTML><HEAD><TITLE>*[Outwit - Version 8.0!]*</TITLE><br />
<META http-equiv=Content-Type content="text/html; charset=windows-1252"><br />
<STYLE>BODY {<br />
SCROLLBAR-FACE-COLOR: #606f6f; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; SCROLLBAR-SHADOW-COLOR: #ffffff; SCROLLBAR-3DLIGHT-COLOR: #606f6f; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #606f6f; SCROLLBAR-DARKSHADOW-COLOR: #000000<br />
}<br />
</STYLE><br />
<br />
<META content="MSHTML 6.00.2800.1106" name=GENERATOR></HEAD><br />
<BODY text=#000000 bottomMargin=0 vLink=#203720 aLink=#203720 link=#203720 <br />
bgColor=#9eaaaa leftMargin=0 topMargin=0 rightMargin=0 marginheight="0" <br />
marginwidth="0"><br />
<center><MAP name=FPMap0><AREA shape=RECT target=main <br />
coords=113,205,211,219 <br />
href=http://www.htmlforums.com/archive/index.php/"http://www.everlasting-misery.com/christopher/html/aboutme.html"><AREA <br />
shape=RECT target=main coords=239,205,327,219 <br />
href=http://www.htmlforums.com/archive/index.php/"http://www.everlasting-misery.com/christopher/html/foryou.html"><AREA <br />
shape=RECT target=main coords=354,204,400,219 <br />
href=http://www.htmlforums.com/archive/index.php/"http://www.everlasting-misery.com/christopher/html/site.html"><AREA <br />
shape=RECT target=main coords=425,204,473,219 <br />
href=http://www.htmlforums.com/archive/index.php/"http://www.everlasting-misery.com/christopher/html/web.html"><AREA <br />
shape=RECT target=main coords=498,205,618,219 <br />
href=http://www.htmlforums.com/archive/index.php/"http://pub.alxnet.com/guestbook?id=2370757"></MAP><IMG height=693 <br />
src=http://www.htmlforums.com/archive/index.php/"[Outwit - Version 8_0!]_files/main-image.jpg" width=740 useMap=#FPMap0 <br />
border=0></center><SPAN style="LEFT: 55px; POSITION: absolute; TOP: 237px"><br />
<IFRAME border=0 name=main <br />
src=http://www.htmlforums.com/archive/index.php/"[Outwit - Version 8_0!]_files/outwit-frame.htm" frameBorder=0 noResize <br />
width=670 height=435></IFRAME><br />
</SPAN><br />
</BODY><br />
</HTML><br />
<br />
I stress the same thing I did in my earlier post - your iframe will NOT line up in a screen resolution larger than 800x600!!! And that is a MUCH worse problem! <br />
<br />
Neil<!--content-->Man I just just spent the best part of half an hoir trying to sort that out....<br />
<br />
Nice one and well put Option1... take his advice and get a maid in and clean that mess up... if you are gonna use CSS then learn the rules... and start with keeping all attributes arranged correctly and all in lower case. I hope the previous suggestion works for you... wouldn't it have been easier to center the table than muck round with co-ords?<br />
<br />
I'll have to be faster next time.<!--content-->ohhh tricky..... not, if you want to fix that gap then move your iframe up, you set the position in the span tag. I centered it and made it higher.<br />
<br />
<SPAN style="LEFT: 52px; POSITION: absolute; TOP: 225px"><br />
<br />
that is what I used, looks better. BUT, you better fix your tag nesting and the reason why you have a big gap at the bottom is because you didn't make you iframe long enough. that is all the background image (which by the way is waaaayyy to big to Download <!--more--> for a 56k modem user)<br />
<br />
if you want help then you have to at least try some of these peoples suggestions.<br />
<br />
edit: oh wrong gap :P the botom gap after you main image is part of the P tag you used. take the P tag out and it will be fine, add a div tag and align it center with that.<!--content-->Thanks so much guys! problem solved :)<!--content-->
 
Back
Top