CSS Nerds
- Started
- Last post
- 15 Responses
- sisu
CSS Nerds, I could use your help...
I've posted a simplified version of some code I'm using for a site here:
http://sisuhome.com/example/In the example, I have a main container. Inside the container are 2 DIVs (blue), each containing and image and a 3rd DIV (yellow rectangle) that I'm floating just outside of the container using a negative position.
The problem is that even though I'm floating the yellow box out of the way, the first image within the first blue DIV is being pushed down (the same amount as the height of the floated DIV). I'd like the image to slam up to the top.
I've been trying a bunch of fixes for this (display, clearfix, etc) but cannot figure this out.
Help?
- univers0
I did a couple things in firebug to get them to float right together but I lost the scroll follow, I don't know if thats because of firebug or not.
First I added a container around your two project divs.
In that container make sure you are float: left; overflow: hidden;
Then on the nav kill the right positioning and just have float: left; overflow: hidden.
- univers0
Some times your parent container may need to expand a little bit to hold both of them next to each other. Floats get nasty when you are dealing with one object moving by multiple objects vertically. Containers are nice.
- sisu0
Thanks univers, gave it a try and no luck. I suspect I'll just need to make the container wider to accomodate...
- univers0
Do you want to use Jquery follow for aesthetic reasons??? couldn't you use a z-index fixed position? would solve a lot of problems for you.
- sisu0
... like this: http://sisuhome.com/example/indeā¦
- univers0
You have skype or something I can email you... chat before I go to bed to see if I can help.
- sisu0
Thanks for the offer but I think i've sorted out the issue with the latest link, above.
Ideally I wanted to keep the total width of the site down to 980 (at least only get scollbars at dimensions less than 980. I don't think it's possible.
- univers0
Sure
When you add padding of 30px to your projects with a width of 920px.. you are adding a total of 60px to your width. So just account for that in your width setting and you will be fine at your total width for browsers like 1024 etc.
- sisu0
Right. Thanks for your help!!!
- univers0
np!
- instrmntl0
Should been titled CSS Jocks.
- univers0
pshhhh what?
- graffusg0
make sure you check out these short films...
got to love em...show ur hate or love...thanks!
www.funkygraffish.com
www.goldstandardstudios.com