...

View Full Version : White space below website



RDLyTN
11-06-2011, 08:47 AM
I have a problem.
Below my website (http://www.i4-it.be) there is a big white space.
But this is not in all browsers, but only in firefox i guess.
Does someone have a solution for this problem?

CODE:

body {
font-family:Tahoma, Geneva, sans-serif;
margin:0;
padding:0;
}

a:link, a:visited, a:hover, a:active; {
text-decoration:none;
}

#body {
width:100%;
height:1000px;;
background-image:url(img/background.gif);
}

#wrapper {
position:relative;
margin:auto;
top:-231px;
width:1024px;
height:100%;
}

/* Header */

#bannerbg {
position:relative;
top:33px;
width:100%;
height:231px;
background-image:url(img/bannerbg.gif);
}

#bannerlogo {
position:relative;
top:26px;
left:170px;
width:120px;
height:245px;
background-image:url(img/logobanner2.gif);
}

/* Navigatie */

#nav {
position:relative;
top:-212px;
left:295px;
width:444px;
height:32px;
}

.home {
width:73px;
height:32px;
float:left;
}

.about {
width:80px;
height:32px;
float:left;
}

.services {
width:94px;
height:32px;
float:left;
}

.portfolio {
width:103px;
height:32px;
float:left;
}

.contact {
width:94px;
height:32px;
float:left;
}

/* Footer */

#bottombg {
margin:0 auto;
position:relative;
top:-309px;
width:100%px;;
height:78px;
background-image:url(img/bottom.gif);
}

#bottom {
margin:0 auto;
position:relative;
top:px;
width:1024px;;
height:78px;
background-image:url(img/bottom.gif);
}

#sitemap {
position:relative;
top:13px;
left:174px;
width:238px;
height:54px;
font-size:9px;
}

#sitemap a:link, a:visited {
color:white;
text-decoration:none;
}

#sitemap a:hover, a:active {
text-decoration:none;
color:#009ee3;
}

#bottomadres {
position:relative;
top:-41px;
left:715px;
width:150px;
height:54px;
font-size:9px;
}

#bottomlogo {
position:relative;
top:-48px;
left:86px;
width:60px;
height:56px;
background-image:url(img/logo.gif);
}

SB65
11-06-2011, 09:15 AM
It's caused by the numerous negative top value within your css.

No quick fix to this I don't think. If you set #bannerbg to position:absolute and remove the top setting from #wrapper that's a start, then you need to work through your css and use float, margins and probably a bit more abolute positioning with the aim of removing all the top properties on your main elements.

RDLyTN
11-06-2011, 09:26 AM
It's caused by the numerous negative top value within your css.

No quick fix to this I don't think. If you set #bannerbg to position:absolute and remove the top setting from #wrapper that's a start, then you need to work through your css and use float, margins and probably a bit more abolute positioning with the aim of removing all the top properties on your main elements.

and if i use negative values in 'margin-left' or 'margin-top' is that a problem?

SB65
11-06-2011, 10:19 AM
There shouldn't really be a need to use negative margins as a general solution to layout. If you're using it to pomove elements up so they are positioned side by side then float is a much better option.

RDLyTN
11-06-2011, 10:29 AM
There shouldn't really be a need to use negative margins as a general solution to layout. If you're using it to pomove elements up so they are positioned side by side then float is a much better option.

Oke thank you very much!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum