Posted by Chris Beall on 02/26/06 05:09

asnowfall@gmail.com wrote:
> Here is rought layout of my page
>
> *******menu****
> <IMG>
> <IMG>
> <IMG-last>
>
>
>
> *****copyright****
>
> Where 'Tx' standd for <mage.
> I want to maintain the distance between <IMG-last> & 'copyright' label
> constant; even when window is resized(i,e with presence of scroll
> bars). I do not like 'copyright' label to appear right under the
> (T5,56).
>
> Thanks for your response..
> Ramesh
>

Ramesh,

Non-technical answer: In the US, it is no longer necessary to place a
copyright symbol on your work in order to protect it. It doesn't do any
harm, but it doesn't really do any good either. Since the copyright
will take up space, and since your requirement for a gap between it and
the final image will also take up space, the easiest solution to your
problem is to drop the copyright.

Technical answer:
- If you DID extract the screen height, what would you do with it?
First, to get the screen height, you need JavaScript, which will not
always be available on the client system. If it isn't available, what
will you do? Once you figure that out, then do that thing all the time
and forget about screen height.
- The best technical solution is to position the copyright at the
bottom of the viewport and give it a top margin large enough to satisfy
your eye. Something like:

HTML:
<div class="copyright">
<p>Images, HTML, and CSS Copyright 2006 by Ramesh</p>
</div>

CSS:
div.copyright { position: relative ;/* Establish 'positioned' ancestor */
text-align: center ; /* Center the contained text */
}
div.copyright p {
color: black ; /* Must specify colors */
background-color: white ; /* otherwise transparent! */
position: fixed ; /* position relative to window */
bottom: 0 ; /* against the window bottom */
left: 0 ; /* Stretch to go clear */
right: 0 ; /* across viewport */

margin-bottom: 0 ; /* Adjust to suit */
padding-top: 20px ; /* with a nice top padding */
}

In addition, since the copyright now covers some of the bottom of the
window, you will need to put a bottom padding or margin on the lowest
thing on the page, otherwise it will be hidden behind the copyright.

The above was tested on Opera and Netscape 7.1, which means Firefox
should work. Unfortunately, IE 6 does not honor position: fixed, so it
just puts the copyright at the bottom of the page and does not lock it
to the window. Perhaps IE 7? Or perhaps users will abandon IE for
something more functional...

Chris Beall

[Back to original message]