Forum Moderators: not2easy
I'm new to the forums - but diving into table-less designs so I bet I'll be on here a lot from now on :)
I'm trying to convert a design to div's and css and I'm running into an issue. The behavior I'm going for is just like: <snip> (still using tables)
I'm very close and have one issue:
The background on the right side - I am using "left: 50%; margin-left: -Xpx;" technique to line it up, but the problem is, I need to make it fall off the page when it's too small. Right now I get a horizontal scroll bar. I tried making the body use overflow: hidden, but then I lose the vertical scrollbar, which I need to keep.
So the real question is, how can you make a div and position it far off to the right, partially off the viewable page, and make it work like a fixed position so there's no scroll.
Fixed position didn't work either because then when you scroll down the image follows.
If any code would help I can post, just say the word.
Thanks!
Also thanks to everyone whose posted before, I've read so much useful info on here already.
Mike
[edited by: swa66 at 8:12 pm (utc) on Dec. 29, 2008]
[edit reason] No personal URLs, please see forum charter [/edit]
Welcome to WebmasterWorld! It is great to have you on board!
Posting your code would be most helpful.
Before you do so, you might wish to read the Forum Charter [webmasterworld.com] which will give you guidelines and suggestions on what to post and how much to post.
Another suggestion is to run this through the validator to make sure things are validating for you and to maybe pick up any typo's that you might have.
Once again, welcome aboard! :)
After doing some more research and experimentation I was able to figure it out. You can do:
overflow-x: hidden;
on the Body. This was the only way I could figure out how to make it work. The code I have has a lot of different elements in it, and it was only one fundamental thing I was trying to figure out. I wonder though if anyone has any other ways to accomplish the same thing...just being able to get an element to sit past the right edge of the page without having a horizontal scroll. I tested the overflow-x method in IE, FF and safari and it's working well.
Thanks!