css issue

[diamotsu]

I'm trying to use a footer on my page. Using css the id is as follows
#footer {
positon:absolute;
bottom:0px;
text-align:center;}

<p id="footer">
This page was designed by Dublin Entertainment Co. Copyright 2011
</p>

I'm wanting the footer to always appear at the very bottom of the page. any ideas?

 

[diamotsu]

pfft... typo

 

[Frank]

any ideas?

Yep: Create a Fixed ('Sticky') Footer with CSS.

 

[notarypublic]

Just implemented this myself, actually. You're close.. try this:

<div id = "footer">
<p>Your content</p>
</div>

Generally, it's good practice semantically to position divs instead of direct elements of text. Easier to change text/content later, too.

If this doesn't fix it, post your code.

 

[PixelPusher]

Just implemented this myself, actually. You're close.. try this:

<div id = "footer">
<p>Your content</p>
</div>

Generally, it's good practice semantically to position divs instead of direct elements of text. Easier to change text/content later, too.

If this doesn't fix it, post your code.

Correct, use the a div to position the text and then the semantically correct element to contain it. In this case a paragraph would be fine.

@notary need to remove the spaces in the id attribute.

OP
If you want to "fix" an element to a place on the page, you will want to use "fixed" position. Keep in mind, fixed positioned elements do not follow the normal flow of the page and will overlay and static element. You can control the "layering" of positioned elements (any elements with a position other than "static") through the css property z-index. The higher the number the more precedence.

Fixed Position Footer

<div id="footer>
  <p>Your footer text</p>
</div>
<!-- or in HTML5 -->
<footer>
  <p>Your footer text</p>
</footer>

CSS

div#footer {
position:fixed;
bottom:0;
left:0;
}
div#footer p {
line-height:1.7em;
text-align:center;
}