Hi guys,
Recently i asked for some help to make my header stand in front of my scrollable blog.
Now I am using <strong>FancyBox for Wordpress</strong> and the photos are previewed behind the header!!
Please have a look, visit http://rockwellhouse.co/wordpress/cold-but-beautiful/
as an example and click on the image.
Could anyone help me get this going right?!
Thanks
Cosmin Popovici answers:
Modifying the z-index property to this:
#head { z-index:12;}
in the style.css on line 18 will do the trick.
It just needs one point over the z-index value of the nav/content containers :)
Steven Ellis comments:
perfect! that was simple! great!
thank you.
Utkarsh Kukreti answers:
Try changing the z-index on #head to 500.
Add this to your style.css
#head { z-index:500; }
Utkarsh Kukreti comments:
Or edit
#head { background-color:#FFFFFF; left:-100px; padding-top:0; position:fixed; top:0; z-index:999; }
to
#head { background-color:#FFFFFF; left:-100px; padding-top:0; position:fixed; top:0; z-index:500; }
in your style.css
Ben Huson answers:
Your header is now appearing in front of the default z-index for FancyBox.
If you add the following to your theme's styles.css this should force FancyBox to be in front.
#fancy_overlay {
z-index:1000 !important;
}
#fancy_outer {
z-index:1000 !important;
}
(ed: or change the header z-index to be be less as the previous answer - I think we cross posted)