CSS help and feedback! Cheers ;)

Associate
Joined
2 Oct 2003
Posts
2,121
Location
Chester
12bm.png


The footer bar thingy, I dont know how to position it at the bottom of the page without using absolute positioning. It just needs to be below the content boxes thats it. Ideas?

Also, what do you think so far of the design?
 
Associate
Joined
27 Nov 2002
Posts
1,729
Location
Catford
i quite like it :)

about the footer, im not posative, but i dont think you can really place a footer their like that, i presume you'd want it to move down ass you add content to the page.

I believe you will have to just sit it under the left links you got their, or use floats instead of absolute positioning ?
 
Associate
OP
Joined
2 Oct 2003
Posts
2,121
Location
Chester
I think this should be sufficient :)

#sidebar {
width: 160px;
float: left;
}

#sidebar, #center {
background-color: #000;
border: 1px solid #4e4e4e;
margin: 40px 10px;
}

#center {
position: absolute;
right: 170px;
left: 170px;
min-width: 300px;
}

.content {
background: url(images/gradient.gif);
background-repeat: repeat-x;
background-color: #111111;
border: 1px solid #4e4e4e;
margin: 10px;
padding: 10px;
}

#footer {
background: url(images/footer.gif);
background-repeat: repeat-x;
background-color: #000;
width: 100%;
position: absolute;
bottom: 20px;
}
 
Soldato
Joined
3 Aug 2005
Posts
4,534
Location
UK
Code:
#footer {
background: url("images/footer.gif") left top repeat-x #000;
clear: both;
margin-bottom: 20px;
}
That should do the trick.

The design looks pretty good from here, and it's good to hear you're going down the XHTML/CSS route :)
 
Associate
OP
Joined
2 Oct 2003
Posts
2,121
Location
Chester
Al Vallario said:
Code:
#footer {
background: url("images/footer.gif") left top repeat-x #000;
clear: both;
margin-bottom: 20px;
}
That should do the trick.

The design looks pretty good from here, and it's good to hear you're going down the XHTML/CSS route :)

Interesting! New come across clear before. Outcome:

untitled13rg.png


Thanks for your time mate :)
 
Back
Top Bottom