Page Goes On an On Forever, using CSS

tbuck · #1 Nov 9th, 2007, 18:06

http://www.lincolnsafari.org/registration.html

I used CSS to do this page, but as you can see, the orange background, goes on forever, and ever. I've tried changing the height of the containerr div, but it doesn't fix it. Any help?

karinne · #2 Nov 9th, 2007, 18:10

Remove

HTML: Select all

<?xml version="1.0" encoding="utf-8"?>

as IE doesn't like it and validate.

You have 375 errors!

It might solve your problem, it might not but at least we'll be working will validated code.

tbuck · #3 Nov 9th, 2007, 18:23

I removed that line, but it's still not changing the height. Is the doc type right? I never really understood which doc type I should be using.

karinne · #4 Nov 9th, 2007, 18:26

The doctype is fine ... just get rid of those errors.

tbuck · #5 Nov 9th, 2007, 19:19

I found a better doc type to use from alistapart.com
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

And now there a far fewer errors. But the page is still going on forever in safari and IE, but not in firefox?

Aso · #6 Nov 9th, 2007, 19:33

But you still have errors! As karinne said, fix them! It's a lot easier to solve the problem if you can conclude it's not a parsing error

tbuck · #7 Nov 9th, 2007, 19:36

Line 38, Column 6: end tag for element "HEAD" which is not open.

Line 39, Column 159: document type does not allow element "BODY" here.

i still get these 2 errors, and I don't know how to fix them? The head tag is open, and that is the line that closes it. And then the body tag is right below it. I thought this is fine?

Marc · #8 Nov 9th, 2007, 20:02

Under your doctype, you need an <html> tag.

tbuck · #9 Nov 9th, 2007, 20:18

Oh wow, can't believe I missed that. Ok added that in, but still the 2 errors.

dab42pat · #10 Nov 9th, 2007, 20:42

not sure if i got all your code correctly but try this on your page for validation.

HTML: Select all

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<link rel="stylesheet" href="http://www.lincolnsafari.org/safari.css" type="text/css" media="screen">
<link rel="stylesheet" href="http://www.lincolnsafari.org/print.css" type="text/css" media="print">
<title>Lincoln Safari: Registration</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body onload="MM_preloadImages('images/SafariDetails_r5_c3_f2.gif','images/SafariDetails_r6_c3_f2.gif','images/SafariDetails_r7_c3_f2.gif')">

tbuck · #11 Nov 9th, 2007, 20:47

Hey that got rid of the errors, but now onto the Big problem....why is my page so long? arg.

Thanks for helping fix the errors though.

Marc · #12 Nov 9th, 2007, 20:54

I dont really understand your question... Your page is long because the content is stretching it...

tbuck · #13 Nov 9th, 2007, 20:59

In Safari, the orange background goes on for a long time. And in IE, if you try to print the form, it tries to print 180 pages.

AdRock · #14 Nov 9th, 2007, 21:39

What does this mean

Quote:

This Page Is Tentatively Valid HTML 4.01 Transitional

Not properly validated....a temporary fix?

AdRock · #15 Nov 9th, 2007, 21:44

Quote:

Originally Posted by tbuck

In Safari, the orange background goes on for a long time. And in IE, if you try to print the form, it tries to print 180 pages.

I think you'll find if you look in IE7, it does the same as in Safari

karinne · #16 Nov 10th, 2007, 00:16

Quote:

Originally Posted by tbuck

I found a better doc type to use from alistapart.com
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

And now there a far fewer errors. But the page is still going on forever in safari and IE, but not in firefox?

That's not a better doctype! Keep the strict doctype

Choosing the best Doctype for your website

Stuart · #17 Nov 10th, 2007, 03:15

Yup, Karinne is right! Always use HTML 4.01 Strict... It is the best to use.

Say Karinne, what is the HTML 4.01 Strict equivalent to target="_blank"? It does not validate and I do not know of another way to open a new window with a link...

MikeHopley · #18 Nov 10th, 2007, 10:18

Quote:

Originally Posted by swagner

Say Karinne, what is the HTML 4.01 Strict equivalent to target="_blank"? It does not validate and I do not know of another way to open a new window with a link...

Some items are deprecated because they are bad coding practices. For example, <font> is deprecated in favour of CSS, which is much more efficient. There's nothing wrong with changing font styles, but <font> is an inefficient method.

Other items, such as target="_blank" are deprecated because they are fundamentally bad. It's maddening when a website takes control of the browser; it feels like a violation!

Designers use target="_blank" because they don't want users to leave their website. This is stupid for two reasons:

It's much easier for a user to return to your site by using the "back" button. Opening a new window will likely make it harder to find your site again!
Users will leave if they want to, no matter how hard you try to stop them. You can either let them do it -- a cordial goodbye -- or you can fight them. Fighting them won't stop them leaving, but it will make them hate you.

In cases where you want a little pop-up window, you need to use javascript pop-ups. But why not keep everything on one page? You can use javascript to show/hide elements. Remember that the content should remain accessible when javascript is disabled (so make things visible by default, then hide them with JS).

Beware that pop-up windows are blocked by many browsers.

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
Page Goes On an On Forever, using CSS