Z-Index not working on Safari - fine on Firefox and Chrome

html css twitter-bootstrap safari z-index
manicatorman picture manicatorman · Nov 30, 2016 · Viewed 24.5k times · Source

The Z-index isn't rendering properly on Safari - but it is working fine on Chrome and Firefox. I can't figure out what the Safari specific bug would be.

Here is the relevant code:

And here are some images showing the differences between the browser looks:

Chrome Safari

I am using both Bootstrap and JQuery.

Thanks for the help!

Answer

Jayesh picture Jayesh · Nov 30, 2016

This should probably fix your issue on safari -webkit-transform:translate3d(0,0,0);

Related questions

vertical-align with Bootstrap 3

I'm using Twitter Bootstrap 3, and I have problems when I want to align vertically two div, for example — JSFiddle link: The grid system in Bootstrap uses float: left, not display:inline-block, so the property vertical-align doesn't work. I tried using …

Read More
Text-align class for inside a table

Is there a set of classes in Twitter's Bootstrap framework that aligns text? For example, I have some tables with $ totals that I want aligned to the right... <th class="align-right">Total</th> and <td …

Read More
Bootstrap NavBar with left, center or right aligned items

In Bootstrap, what is the most platform-friendly way to create a navigation bar that has Logo A on the left, menu items in the center, and Logo B on the right? Here is what I've tried so far, and it …

Read More