z-index problems

[BranCook]

I’m trying to push a div outside of the content window in wordrpess but the div is getting cut off. z-index doesn’t seem to be helping me. Below is an image of what it looks like.

z-index image

[BranCook]

Below is my css:

.ph_social_share_box_top {

float: right;

margin: 0 -150px 20px 30px;

background: #f7f7f7;

padding: 5px 5px 5px 20px;

-webkit-box-shadow: inset 0px 0px 5px 3px #999;

box-shadow: inset 0px 0px 5px 3px #999;

-webkit-border-radius: 10px;

border-radius: 10px;

z-index: 10;

}

[spadooky]

you need to set a position to use z-index, like position:absolute.

[BranCook]

It works for position: fixed but not for position: absolute. Position absolute is what I would rather use.

[TheDoc]

If you are using position: absolute;, you probably don’t need the negative margin. You also can’t use the float: right.

Also, if the container that it is in has a different z-index value, that will effect it as well.

Do you have a link?

[BranCook]

No, I don’t have a link right now, I’m working locally. I will try your suggestions above because I’m actually having some issues in ie9 and ie7. If I continue to have issues I may upload the site to a dev server.

[BranCook]

I think I found the issue. I’m using “overflow: hidden” on a div that surrounds my content. Which I can remove, I’ll just have to adjust my layout a bit but what do I do about my container div not extending to support my content?

[BranCook]

I actually found a hack: CSS floats: container does not stretch to fit floated contents

[Author]

Posts