z-index not working on IOS browers

I've got a container DIV which has a position of relative. Inside this a text input box and another DIV (resultsContainer). This second DIV has position absolute, z-index of 9999 and has children DIV's added by JS fetch response looping through JSON data.

It works on desktop/laptop browers fine.

The resultsContainer is showing on top of everything fine and provides a list of options.

When on IOS Chrome is shows behind everything else on the page? (as if z-index is being ignored.

I've googled it, gave me this option

    -webkit-transform: translate3d(0,0,1px);

How do I highlight (make a box appear) under text that has a background color of its own?

I have a way of highlighting text. I position a red box with z-index of -2 where the text should be. This usually works, but not when there is a span element around the text, with an attribute such as: style="background-color:#ffffff". It seem in this case that the red box is covered up. Here is the actual HTML that does not work:

  <article id="ArticleToHighlightRFS">

css z-index?!


im new here and im not a webmaster nor like it. i have a small website (www.beatassist.eu) and i use the website builder. Although one thing my service is not good is in the navigation menu, so i decided to create one but i cannot make submenus. The problem is i create all menu with submenus, then in my website builder i have a form where to put the scripts (all good), but when i check the menu the submenus appear behind all other things.

Need help with CSS and Z-index


I'm basically new to z-index, and I am trying to get z-index to work on a site in development.

Please go to this page, work in progress: development site

It has been successfully validated as HTML5

This is a Joomla CMS responsive site (Gantry/Rockettheme).

Neighboring element border problem

Hi there,

I have a problem with displaying borders:

Here is my page:


When you hover the mouse over the boxes on the right, the whole border all around should turn red, but it doesn't.

I tried it with "z-index" and "position", but no change. Is there a pure CSS solution?

By the way, I don't care about IE. It should work on firefox and possibly on other browsers (exept IE).

Thanks ...


Syndicate content