Floating images
Date: 12/28/07
(WebDesign) Keywords: css, web
And the saga of creating a tableless webpage on my own continues...
So far, I surprised myself by having all my ideas turn out excellent. It's brilliant. I don't know. I have achieved so much in such a short time for someone researching on their own. It's been a pain though, seriously. There are things I don't understand still, but that'll come with time. I don't have to learn it JUST by redesigning my page in CSS. There will be other webpages.
Anyway, I have a question.
I want to float an image in the bottom right hand corner of my page and have it stay there while the person scrolls down. This page is fluid. Joy.
I've managed to get the image to do this, but in the bottom left hand corner...
So, my question is, is this possible? If so, how do you do this?
I've attempted to look up a solution already, but everything tells me it's not, so I'm hoping someone else can tell me otherwise.
This is what I figured out just now, but it's not perfect...
#bottom_fade img {
width: 300px;
height: 300px;
float: right;
}
/* FADE */
#bottom_fade {
width: auto;
height: 200px;
z-index: 80;
position: fixed;
bottom: 0%;
background-image: url("../images/bottom-fade.png");
background-repeat: repeat-x;
Thanks for your help!
The page is nearly complete, so I'll have it up and ready for critique within the next few weeks.
Source: http://community.livejournal.com/webdesign/1345749.html