Forum Moderators: open

Message Too Old, No Replies

How can I place an image at the bottom of site. So it sticks 2 spot

         

midi25

9:49 pm on Mar 31, 2004 (gmt 0)

10+ Year Member



Hi I have created a header gif and and a footer gif. My header gif is affixed to the top of my page. I want to now place the footer gif at the bottom of my page. I want it to always be at the bottom. So for eg if someone opens my site in 800x600 i want it to be at the bottom. And if someone opens my site in 1024x768 i want it to be displayed at the bottom.

Is there a way I can do this.

Thanks

benihana

9:53 pm on Mar 31, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



does it have to be a link or anything? if not, you could use this css:

body {
background-image:url(footer.gif);
background-position:bottom;
}

obryen

10:00 pm on Mar 31, 2004 (gmt 0)

10+ Year Member



I would do one of two things:

a.) Create a bottom frame and put the image there....

b.) Use JavaScript to make sure the image stays at the bottom as the user scrolls the page.

HTH!

- Dave O.

digitalv

10:03 pm on Mar 31, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Just make a table with a HEIGHT of 90 - 95% (Play with it to see how good it looks) with 3 rows and one column. Insert your HEADER in the top row, the meat of your site in the middle, and your footer at the bottom. Add CSS to the table if you want to manipulate how it looks, spacing, etc. but here is a basic one you could use and go from there:

<table width="100%" height="95%">
<tr><td align="left" height="imageheight">-insert header image-</td></tr>
<tr><td align="left">-insert your site's main content here-</td></tr>
<tr><td align="left" height="imageheight">-insert footer image-</td></tr>
</table>

If the content of the page is larger than the user's screen, it will expand with vertical scrolling. If it's LESS than the size of the user's screen, the table will expand the center row to fill the screen, and the header/footer rows won't expand because they have specific heights defined.

Purple Martin

11:47 pm on Mar 31, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Table heights are not valid with a strict doctype.
Table cells with heights are not valid with a strict doctype.

This is because (strictly speaking) tables are for tabular data, not for layout. The height of the table is supposed to grow/shrink automatically to fit the cata contained in the table.

However, it is still quite common to use tables with specified heights for layout, without a strict doctype.

digitalv

4:58 pm on Apr 1, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



If he was interested in a strict doctype, he wouldn't be trying to force the image at the bottom of the page as forced layouts certainly wouldn't comply to any standards I'm aware of :)

Unconventional requests require unconventional code.

R1chard

6:06 pm on Apr 1, 2004 (gmt 0)

10+ Year Member



So the question is: you have a short page and you want the image to remain at the bottom of the window if the window is resized?

If so, then couldn't you just get the window height with Javascript and then set the absolute image position in pixels with CSS?

Or if you just want it close enough, maybe even just set

<img style="position:absolute; top:92%;">