Footer with a wrong white space below…

[McCss]

Hey guys!!

I am trying to build a very simple layout, I have just three img closed in a div for each one and this div are just one after the other… so it’s just a simple ‘div after div’ in the body… just the only div #wrapper is a container for al those div…

But the wrapper gives me a problem, even if I give it {height: 100%;} or even if I don’t give it height at all, it goes on down after the height of the #footer div, showing a big space at the bottom of the page…

I can’t cut that white space out… just one thing more… the div #blocco-pag is in tha relative position to stay over the gray #footer… if this can help…

I past the code:

Code:

body{
margin: 0px;
padding: 0px;
height: 100%;
overflow: auto;
background: #0c617a;
background-image: url(img/rep_bkg.png);
background-repeat: repeat;

}

#wrapper{
margin: auto;
background-color: white;
border-right: 1px solid white;
border-left: 1px solid white;
width: 1024px;

}

#header{
background-image: url(img/header.png);
width: 1024px;
height: 246px;
margin: auto;
margin-bottom: 80px;

}
#ret_sup{
background-image: url(img/ret_sup.png);
width: 836px;
height: 317px;
margin: auto;

}

#blocco_pag{
background-image: url(img/blocco_pag.png);
width: 895px;
height: 1046px;
margin: auto;
position: relative;
z-index: 5;
}

#footer {
background-image: url(img/footer_rep.png);
background-repeat: repeat;
width: 1024px;
height: 350px;
color: white;
position: relative;
bottom: 250px;

}

h6{
padding-top: 230px;
font-size: 14px;
font-weight: normal;
text-align: center;
font-family: Adobe Caslon Pro,”Times New Roman”,Times,serif;
}

And html code:

Code:

—————-

———————.

Any suggest?? thank you !!!

[EamonnMac]

Sorry, which div are the images in? Are they side by side or stacked vertically?

[McCss]

Any div has got an own img, loaded in the CSS, and all the div stuck vertically on the page… the #wrapper div is the container for all this vertical divs

[McCss]

@ apostrophe

Thx for the advise! But this is a bad news for me… I used to thought that if I gave a percent% of height to the #wrapper div, I could add ay number of divs into it, and so the #wrapper just would followed the number and dimensions of div…

This my thought and doubt come from a little experience making sites and templates with CSS, my attempt is to build a template that could be increase in the future just adding more div that I want… but always with the #footer at the bottom of the page…

But… if you tell me that is not wrong to fixed a height to the #wrapper div I will do it… I just wish to be sure to don’t force my layout in a wrong way just from beginnings…

PS: I see now that fixed heights are different for different browsers…

[Author]

Posts