Sun, 2004-02-29 16:10
Can anyone tell me how to place my javascript date securely in the bottom right of my page (opposite the bottom links)? I don't like using top: XXpx; cos that means adjusting it for every page. Any better ideas?
Have a look at www.glasgowapartment.co.uk or look at my code.
Ta,
Craig
Mon, 2004-03-01 10:23
#1
Have you tried bottom: 0?
Have you tried putting an absolutely positioned div containing a date in your page-container div, giving the container div "position: relative;", and giving the date div "bottom: 0;"?
Here's an example of a date div that's fixed at the bottom of a container div:
CSS:
<style type="text/css">
#content {
width: 500px;
position: relative;
padding-bottom: 20px; /* gives the date some room to fit */
}
#date {
position: absolute;
bottom: 0;
}
</style>
HTML:
<body> <div id="content"> <div id="date">2004-03-01</div> <p>Lorem ipsum dolor ...</p> <p>Pellentesque pede mi, ...</p> <p>Fusce diam urna, tempus ...</p> <p>Suspendisse potenti. ...</p> <p>Maecenas ut mauris ...</p> </div> </body>
Mon, 2004-03-01 11:27
#2
bottom - left placement of date
thanks for that. it seems relative or absolute is my problem (one of them anyway!) ... i just don't get it. Do you have any suggestions for sites that explain this well? Also does bottom left work just as well as top right coordinates?
Mon, 2004-03-01 11:50
#3
bottom - left placement of date
An element with "position: absolute;" is positioned absolutely relative to the padded edge of the nearest ancestor (container) that doesn't use "position: static;" (which leaves position-relative, position-fixed, and position-absolute).
It's a bit confusing, I guess, but just remember that "position: absolute;" doesn't mean the coordinate system is the top-right corner of the browser window unless the body is the immediate container (or the nearest ancestor that doesn't use "position: static;").
I'm not sure where you could read more about this, but I'll Google a bit to see what I can find.
Mon, 2004-03-01 11:53
#4
Eureka!
Here's some information I found on it at Stopdesign:
Mon, 2004-03-01 16:02
#5
bottom - left placement of date
thanks. that has helped me loads.