homepage Welcome to WebmasterWorld Guest from 54.204.141.129
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderator: open

CSS Forum

    
Bottom image alignment
Kasatka




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

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?

 

Birdman




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

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!

DrDoc




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

How about this?

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

Birdman




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

Ah, just what the doctor ordered ;) That one flew right over my head. Good solution.

Kasatka




msg:1183855
 10:59 pm on Feb 13, 2003 (gmt 0)

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?

Birdman




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

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" />

Kasatka




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

Oooh, thank you.

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

=)

DLadybug




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

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 :)

antidote




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

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.

DLadybug




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

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 :)

Jello




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

Found this older thread:
[webmasterworld.com ]

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved