Web Hosting Talk






PDA

View Full Version : help with css, please

6thDay
02-16-2004, 12:36 PM
alright, this may be a newbie question, but i haven't been able to solve it yet. i'm not even sure if this is possible.

what i'd like to do is this:

i'm going to use css to place 2 graphics. one will be left top, and the other will be left bottom. both will span the width of the browser window that's open. i've managed to get the top left one working, but the bottom left one i'm having trouble with.

well, i mean, i can make the picture be at the bottom of the page but i don't want text to go over top of it or under it.i want the bottom image to go down if there is text in the body that takes up more than the small part of the page specified for the body (everything between the top and bottom parts.

thanks in advance!
aredding
02-16-2004, 02:48 PM
not really sure what you mean.. I understand what you are tyring to do but not sure why its not working. Here is how i would have it structured.. Have your container element such as your div or body element and place your top image. then put your bottom image as a background image set NOT to repete and positioned at the bottm of the same container element with some bottom padding to compensate for the height of the image. so text will not run over the top of the image or under it. If you have a live example or can explain it better i can help more.
1jetsam
02-16-2004, 04:07 PM
you have to probaly use tables, (100%) a total of 3 to make and use classes or something like that...
i agree with aredding thought...
6thDay
02-16-2004, 04:21 PM
Originally posted by aredding
not really sure what you mean.. I understand what you are tyring to do but not sure why its not working. Here is how i would have it structured.. Have your container element such as your div or body element and place your top image. then put your bottom image as a background image set NOT to repete and positioned at the bottm of the same container element with some bottom padding to compensate for the height of the image. so text will not run over the top of the image or under it. If you have a live example or can explain it better i can help more.

i know how to do this, but i'd never given thought to having it as an option. thanks! i'll try it out and see how it works/looks. i'll post the result so you can take a look.

thanks again!
aredding
02-16-2004, 04:32 PM
you CAN use tables and ahcive this but I am on a personal mission to help people relize that tables are an inferior way to design a webpage. I am not saying its wrong to use tables, only when its approperate, and as a layout methode is not one of them.

Style:

main {
background-image: url(image.gif);
background-repeat: none;
background-position: left bottom;
padding-bottom:50px
}


Markup:

<html>
<head>
<title>Main</title>
</head>

<body>
<div class="main">
<img src="image.gif">
<br>
Content
</div>
</body>
</html>


This is the way i was describing.
6thDay
02-16-2004, 05:53 PM
that's what i thought you were talking about. i haven't had the time to implement it (still at work), but i'll be doing it at home.

and i agree with the tables thing. i'm personally trying to steer clear of them because i want to have more control over my content, not to mention going through all those tables can just get annoying.

again, thanks