CODEWITHSUNDEEP
cssgoogle-mapsz-index
Mike Oram
Mike Oram

Reputation: 765

google map z-index issue

I know that posting links to the site is considered bad and we should explain the issue but I actually dont really know what the issue is. I have never experienced something like this before.

Page: http://chefs2call.co.uk.gridhosted.co.uk/

Scroll to the bottom, find the google map, inside div #wpgmza_map There is an overlay div creating a blue tint to the map, then another div (.details-box inside .container) that should sit ontop of the map and the overlay.

Currently the overlay is working, but the details box is doing something odd, the background is underneth the google map but the content is ontop (still under the overlay).

As far as I can tell my z-index are correct but it is not playing ball. Any ideas why? or how I might fix it?

Upvotes: 0

Views: 4510

Answers (1)

Alex
Alex

Reputation: 8695

According to w3school:

Note: z-index only works on positioned elements (position:absolute, position:relative, or position:fixed).

So give position relative to the .contact-us .container

.contact-us .container {
    z-index: 10;
    position: relative;
}

Upvotes: 4

Related Questions