CSS - Unexplainable Blank Space Off Screen

I couldn't figure out why people were telling me they couldn't see my page but i could see it just fine in two different locations. Come to find out I use firefox and IE is showing a blank page. Can someone help me with this?

I'm very new to doing my own custom CSS, so please bear with me. I have a feeling I am missing something obvious...

A space of about 22px height is appearing below my nav bar, which itself is 22px high, but is otherwise working fine. I can't figure out what code is causing the space to appear where I don't want it (just under the #page-nav and just above the #page-content).

I'm not sure how to link to my test site, as the forum does not allow new members to link to urls... I can put it in a code tag, but I don't want to 'cheat' the rules... Let me know if that's okay... (the html and css is too long to post here)

(P.S. Many, many, MANY thanks to anyone who can help me figure out this puzzle!)

i am using display:none to hide two divs, but the space where they are located still remains... but only in firefox... here is a link... it happens when you click on one of the tabs at the bottom of the box...

15 Games

thanks for any help.

The website I created has a large blank space at the bottom. I want 30px between the bottom and the layout.

At the top, I could create the space I want.
Margin-bottom: 30px doesn't do the trick.

I tried so many things but I just can't get it fixed. I think something is set too height or something? If someone could figure it out, I would be forever grateful!

You can check out the site and css he


I can't post the url because I'm a new user
Can a mod post my url?

EDIT: I have set the url as my homepage in my profile! Just click my username to check out the site.

I am working on a web page, and am all but done, but I am having one final problem with it. The css drop down menu works fine except for one issue... when you scroll down on one of the pages, and then go to the css menu bar a gap appears between the menu bar and the sub menu options that drop down.

How can I get this menu to always drop down DIRECTLY below the main menu bar without the gap?


___________


Here is the SpryMenuBarHorizontal css

_____________

@charset "UTF-8";

/* SpryMenuBarHorizontal css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/*******************************************************************************

LAYOUT INFORMATION: describes box model, positioning, z-order

*******************************************************************************/

/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: auto;
padding-left: 0px;
padding-right: 0px;
position: relative;
background-image: xxx;
}
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug:
ul.MenuBarActive
{
z-index: 1000;
}
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 16px;
position: relative;
text-align: center;
cursor: pointer;















width: ;
float: left;
background-image: xxx;
padding-left: 0px;
padding-right: 0px;
}
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 8em;
position: fixed;
left: -1000em;
background-image: xxx;
padding-left: 0px;
padding-right: 0px;

}
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
{
left: auto;
}
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
{
width: 9.2em;
}
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
{
position: absolute;
margin: -5% 0 0 95%;
}
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
{
left: auto;
top: 0;

}

/*******************************************************************************

DESIGN INFORMATION: describes color scheme, borders, fonts

*******************************************************************************/

/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
{
border: 0px solid #000000;
}
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
{
display: block;
cursor: pointer;
color: #2C2A2B;
text-decoration: none;
padding-left: 24px;
padding-right: 24px;
padding-top: .5em;
padding-bottom: .5em;
background-repeat: repeat;
background-image: xxx;

}
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{
color: #FFF;
display: block;

}
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
{
color: #FFF;
display: block;

}

/*******************************************************************************

SUBMENU INDICATION: styles if there is a submenu under a given menu item

*******************************************************************************/

/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
{
background-image: XXX;
background-repeat: repeat;

}
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
{
background-image: XXX;
background-repeat: repeat-x;
}
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
{

}
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
{
background-image: xxx;
background-repeat: no-repeat;
background-position: 95% 50%;
}

/*******************************************************************************

BROWSER HACKS: the hacks below should not be changed unless you are an expert

*******************************************************************************/

/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
{
position: absolute;
z-index: 1010;
}
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
{
ul.MenuBarHorizontal li.MenuBarItemIE
{
display: inline;
f\loat: left;
background: #FFF;
}


Thank you so much for your help, I have a deadline that is coming up very quick... I'd appreciate any help I could get.

_______________

my css is sloppy , but at this point with the deadline approaching, I really just need to get this to work properly, and I have a feeling its as simple as a few lines of code changed....