FRIHOST • FORUMS • SEARCH • FAQ • TOS • BLOGS • DIRECTORY
You are invited to Log in or Register a Frihost Account!

How do i?....

   Frihost Forum Index -> Scripting -> Html, CSS and Javascript
 


Parkour_Jarrod
How do a make a div stay at the bottom of a page?, the deal is that i have a copyright div (in my site that im making for the UrT ZoiD Clan) and i want it to stay at the bottom of the page... what do i put to make it stay there?

Code:
div.copyright {
width: 598px;
float: left;
position: relative;
}


Any suggestions?
imagefree
Code:

div.copyright {
width: 598px;
position:fixed;
left:0px;
bottom:0px;
}

or something similar will work, but the main point is that u use position:fixed;
Rapidshare uses something similar. See their source.

This is not going to work with Internet Explorer 6. IE6 (i dont know about later versions) has poor CSS support, but it works fine with Opera and Firefox.
Parkour_Jarrod
Thanks it worked, well in FF3 and most of my site users don't use internet explorer so im pretty sweet about that
sonam
You can use hack for IE6 users. I didn't check it but something like this example (this hack read only IE6) just insert after div.copyright definition.

Code:
* html div.copyright { position:absolute; }


Other definitons (width, etc.) IE6 will get from div.copyright.

Sonam
BillysProgrammer
sonam wrote:
You can use hack for IE6 users. I didn't check it but something like this example (this hack read only IE6) just insert after div.copyright definition.

Code:
* html div.copyright { position:absolute; }


Other definitons (width, etc.) IE6 will get from div.copyright.

Sonam


Just so you know, in good CSS practice, you should not use DIV.NAME, its bad coding practice.
riccopt
BillysProgrammer wrote:
sonam wrote:
You can use hack for IE6 users. I didn't check it but something like this example (this hack read only IE6) just insert after div.copyright definition.

Code:
* html div.copyright { position:absolute; }


Other definitons (width, etc.) IE6 will get from div.copyright.

Sonam


Just so you know, in good CSS practice, you should not use DIV.NAME, its bad coding practice.


why do you say that?
Star Wars Fanatic
Here is a site that is very helpful:
http://ryanfait.com/sticky-footer/

I use it all the time.
sonam
Quote:
Just so you know, in good CSS practice, you should not use DIV.NAME, its bad coding practice.


I don't understand what do you mean. Can you provide us with link where is this explained. BTW, I am just copy/paste code from top CSS because I don't want misunderstanding. Wink

Sonam
Agent ME
I think he means that it would be better to simply use ".NAME" instead of "DIV.NAME", as it's possible you might want to have elements of different tags use the same NAME class.
sonam
Agent ME wrote:
I think he means that it would be better to simply use ".NAME" instead of "DIV.NAME", as it's possible you might want to have elements of different tags use the same NAME class.


Jeah, I think the same about "what he means" but if he wrote "its bad coding practice" then I want to know "Why is bad?" not "Why is different?" Sometime, I see how coders use "DIV.NAME" when they don't want to use class for anything else (e.g. menubar, footer, etc.). Of course, they can use id, too, because is only one id allowed per page. Smile

Sonam
jsfdan
Just to let you know..
if you use

position:abolsolute;
bottom:0;

That <div> will stay at the bottom of the screen and NOT the page. Don't plan on using it if your site has a lot of content.
sonam
jsfdan wrote:
Just to let you know..
if you use

position:abolsolute;
bottom:0;

That <div> will stay at the bottom of the screen and NOT the page. Don't plan on using it if your site has a lot of content.


You are right but I am following imagefree idea. He is using position:fixed for footer div. In that case footer is also sticked on 100% of screen and if you have lot of content then this content is comming out behind footer div. Because this efect is not at possible to get in IE6 we only can fixed footer with position:absolute. Then with few other trick we can get sticky footer in all browser and on the bottom in IE6.

Sonam
Related topics

Bondings
Where do you live?
Command and Conquer
What is your favourite movie?
What is your operating system?
EU domains ready to register in 2006
Most original website contest
Do you use css to design a website?
All movies are here!!!
Counter strike
De da vinci code
http://tuvanonline.com/library/index.php
Free Hosting-Availability
site theme
Webcoder 5
What's Your site About
Reply to topic    Frihost Forum Index -> Scripting -> Html, CSS and Javascript

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2007 Frihost, forums powered by phpBB.