Welcome to WebmasterWorld Guest from 54.158.36.59

Forum Moderators: not2easy

Message Too Old, No Replies

Bottom image alignment

     
9:25 pm on Feb 12, 2003 (gmt 0)

10+ Year Member



I'm just doing a simple website for somebody else with frames. The left frame has the menu, with images as the links (just reading "about me" "links" stuff like that).

At the bottom of the list is an image of the dolphin that I want to be flat against the left margin and the bottom of the page.

I did leftmargin=0 (which somebody called Microsoft's pseudo-CSS) and that's fine, but I can't get it to align right up against the bottom of the page.

I don't want to use absolute positioning because I want this page to work in different sized browser windows.

Any suggestions?

9:30 pm on Feb 12, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



That sounds like it could be difficult. You could style your image with margin-bottom: 100%, but IE will mess it up.

Maybe use JavaScript to get the window height, and then use absolute positioning to slide it to the bottom.

Just a thought :) Welcome to Webmaster World!

9:42 pm on Feb 12, 2003 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member



How about this?

.myclass {
position: absolute;
left: 0px;
bottom: 0px;
}

9:48 pm on Feb 12, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Ah, just what the doctor ordered ;) That one flew right over my head. Good solution.
10:59 pm on Feb 13, 2003 (gmt 0)

10+ Year Member



Er, okay, my knowledge of CSS comes from looking at code on other pages and playing with it until I figure out what it does. (Doesn't always work, but usually I do well with it.)

But anyway, I'm not exactly sure what to do with that little snippet in there as I've never run across it before. (Really, I should break down and buy a book and plow through it.) Do I have to specify something with the image itself to say I want that particular image at the bottom?

1:03 am on Feb 14, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Don't break down yet. Start with Nick's CSS Tutorial [webmasterworld.com] and use W3schools [w3schools.com] as a reference.

The easiest way for now, just to test, is to try inline:

<img style="position: absolute; left: 0px; bottom: 0px;" src="your/path" />

2:18 am on Feb 14, 2003 (gmt 0)

10+ Year Member



Oooh, thank you.

If I was a hugging person I'd give you a hug.

=)

6:41 pm on Feb 15, 2003 (gmt 0)

10+ Year Member



When I tried that, I got my div at the bottom of the browser window, not at the bottom of the page. I'm missing something about parent elements I'm thinking. I'll read up on that. But this is the only way I've been able to place a div at the bottom of my page..and pixel counting shouldn't be the basis for placement, I know.

#content3 {position:absolute;
left:2px;
top:1230px;
border:ridge 2px #ccffff;
background:ffffff;
font:12px, "Arial";
color:#333399;
width:70%;
z-index:4;
padding:2px;
margin-bottom:2px;}

If I take off the 3rd line and replace it with bottom:0px and ax the last 2 lines, the div just camps mid-page.

Ideas?
Dian :)

7:42 pm on Feb 15, 2003 (gmt 0)

10+ Year Member



You could make your image a background image in that particular frame and use the following:

body {
background-position: bottom left;
}

This way it will stay there no matter what size your user makes his/her window.

9:56 am on Feb 16, 2003 (gmt 0)

10+ Year Member



This is clearly "Icehouse ralated" as is much of what I do on Sat night after a night out...but, um...Frames? oh. If we're talking frames, I'm in the wrong discussion. I was hoping to use that for placement without frames..

OOOps. Is there a penalty for not paying attention?

Dian :)

10:16 am on Feb 17, 2003 (gmt 0)

10+ Year Member



Found this older thread:
[webmasterworld.com ]
 

Featured Threads

Hot Threads This Week

Hot Threads This Month