Webpage looking different for other people

[LordBP]

Hello everyone,

I am having a problem with my website where different people see my page different than I do.

It has to do with the content on the Home page, Republicans, and Democrats not showing up at the top of the screen but rather way down below. They just see a large blank space at the top.

What might be causing this?

My site www.theelectionguide.com.

Thanks.

[WebJoel]

I am showing 10 "warnings" in there. A "warning" is not necessarily an "error", -they could be deprecated tags, or proprietary (IE-only) tags. Some things are truly just 'a warning', -like using a "<br />" inside of a series of <li></li><br /><li></li> (which you do have).

There are however, at least two 'un-closed DIVs' and while this may not damage the page if the missing-close is the end of the page, if there is content 'after' the missing-close, then, there is trouble...
But the biggest 'warning' I spotted, was using a <div> inside of a <h4> tag (line 51, column 3). A "header" is "block-level" and you cannot put a "div" inside of that. This alone could be busting the page's expected layout/appearance in compliant browsers...

A quick validation/correction of these might help. I do see the difference that you write of, -looks okay in IE but 'missing something' in Fx... -this could easily be due to the unclosed DIV or the <h>-tag-nested DIV...

p.s., -Go Hillary! :) (NY is my former home state).

[Dopple]

I always use this called before my actual style sheet. It initialises all browser default styling. It might sort this out for you.

Care of http://kurafire.net/log/archive/2005/07/26/starting-css-revisited

/* =INITIAL
v2.1, by Faruk Ates - www.kurafire.net
Addendum by Robert Nyman - www.robertnyman.com */

/* Neutralize styling:
Elements we want to clean out entirely: */
html, body, form, fieldset {
margin: 0;
padding: 0;
font: 100%/120% Verdana, Arial, Helvetica, sans-serif;
}

/* Neutralize styling:
Elements with a vertical margin: */
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address {
margin: 1em 0;
padding: 0;
}

/* Apply left margin:
Only to the few elements that need it: */
li, dd, blockquote {
margin-left: 1em;
}

/* Miscellaneous conveniences: */
form label {
cursor: pointer;
}
fieldset {
border: none;
}
input, select, textarea {
font-size: 100%;
}

[WebJoel]

I can in some ways how that is better than zero-ing everything with
* {margin:0; padding:0; border:0;}
this (above), I find myself having to add alot of additional styling to affect what I need to do, like margins for H-tags, etc (although ultimnately I do like the way it makes my finished work appear in multi-browsers). Great advice. :)