Some help with a z-index issue (I think!?!) please!?!


(Becca) #1

Hi all,

I am updating my husband’s website and he would like some added content to his portfolio pages.

Due to being a ‘new user’ I can only use two links so here is a link to an example site which has all the relevant pages on!

The scheme I am working to can be found on the example site. This is how the pages currently look (all links are set for the main site on this page still).

I have used BlocksBox as a theme, the blank page approach has worked well for what we have needed. Each portfolio page is created in a Blocks page, with a central image then roll-overs for previous/next buttons and a close button which returns to the main portfolio page.

The added content he wants this year is for a caption box to explain his work further.

Going through my collection of Stacks I’ve had a go with quite a few and then used the wonderful functionality of Pluskit to bring them into Blocks layout already in use.

Ideally we want to use Will Woodgate’s HoverBox stack which looks like this - see example site.

But when Pluskitted into the Blocks page it looks like this (see site!). The next/previous and close buttons are no longer seen. I think I need to change the z-index number on one of the elements (probably the Hoverbox) but can’t work out what the CSS name would be. I have tried changing the order of the layers within the Blocks set-up window but this has made little difference.

And yes I have tried other approaches. Currently Joe Workman’s Popup Caption is coming in a close second with is looking like this (sorry… see site) once Pluskitted. But like I said, ideally we would rather use HoverBox!

Alternatively, I would be open to suggestions for re-jigging the master portfolio page. As long as it had next/previous/close buttons. I’ve had a little fiddle with Will Woodgate’s TopBox which could well work once I’ve properly reacquainted myself with it again.

Any help greatly received thank you!!

Cheers

Becca


(Stuart) #2

Try this global CSS:

div#id1_outside,div#id2_outside,div#id3_outside{
	z-index: 99 !important;
}

(Becca) #3

You beaut @kryten, works a treat, thanks!