keep a footer at base of window
Moderator: General Moderators
-
malcolmboston
- DevNet Resident
- Posts: 1826
- Joined: Tue Nov 18, 2003 1:09 pm
- Location: Middlesbrough, UK
keep a footer at base of window
i dont normally ask for code but im kinda stuck here......
basically im looking for a piece of code that will make a footer at the bottom of the page rehardless of whether the rest of the content actually goes upto that point and if it does, just put the footer after all the content?
hope someone understands what im saying.
any help would be fantastic.
basically im looking for a piece of code that will make a footer at the bottom of the page rehardless of whether the rest of the content actually goes upto that point and if it does, just put the footer after all the content?
hope someone understands what im saying.
any help would be fantastic.
Make a div and use the following formatting
So the HTML would look like this
Code: Select all
#corner_bottom_right{
position: absolute;
bottom: 0;
right: 0;
z-index: 4;
visibility: visible;
}Code: Select all
<div id="corner_bottom_right">This is in the bottom right corner</div>-
malcolmboston
- DevNet Resident
- Posts: 1826
- Joined: Tue Nov 18, 2003 1:09 pm
- Location: Middlesbrough, UK
-
malcolmboston
- DevNet Resident
- Posts: 1826
- Joined: Tue Nov 18, 2003 1:09 pm
- Location: Middlesbrough, UK
-
malcolmboston
- DevNet Resident
- Posts: 1826
- Joined: Tue Nov 18, 2003 1:09 pm
- Location: Middlesbrough, UK
its a reference for eg
you have this tag in your HTML
now if you want to stylise that in CSS one of the ways of referencing to it is
i personally prefer this method as i find it easier to read the CSS sheet and see exactly what its stylizing, because my style sheets often run into 1000+ lines
on a side note, i have discussed this with feyd through MSN and shown him what happens on the site and hes as baffled as i am
you have this tag in your HTML
Code: Select all
<div class="this-class">something</div>Code: Select all
div.this-class {
}on a side note, i have discussed this with feyd through MSN and shown him what happens on the site and hes as baffled as i am
-
malcolmboston
- DevNet Resident
- Posts: 1826
- Joined: Tue Nov 18, 2003 1:09 pm
- Location: Middlesbrough, UK
btw, from what i understand referencing a style through div.footer is the accepted method
also dont mean to be picky but thought i should point out to help novice users
also dont mean to be picky but thought i should point out to help novice users
i remember that you are not supposed to have _ in CSS class names as it can cause problemspatrikG wrote:Code: Select all
#corner_bottom_right{ position: absolute; bottom: 0; right: 0; z-index: 4; visibility: visible; }
# indicates CSS positioning of a DIV-element - I couldn't find a technical explanation, though. I would think that you need to use <div id=''> rather than <div class=''> because it accesses a different part of the DOM - that's just my hypothesis, though.
just a hint in case the HTML document is smaller than a screen: add
and the footer will always be at the bottom of the screen.
just a hint in case the HTML document is smaller than a screen: add
Code: Select all
body{
height: 100%;
}Strange, div.footer works for me with:
and
Is the page you are having trouble with online? If so, would you mind posting the URL (you can send me a PM if you prefer).
Code: Select all
div.footer {
position: absolute;
bottom: 0;
right: 0;
z-index: 4;
visibility: visible;
}Code: Select all
<div class="footer">Something</div># indicate CSS positioning of any element with id attribute set to certain value.patrikG wrote: # indicates CSS positioning of a DIV-element - I couldn't find a technical explanation, though.
exactly.I would think that you need to use <div id=''> rather than <div class=''> because it accesses a different part of the DOM - that's just my hypothesis, though.
PS: there was an article at the alistapart.com about footers, IIRC.