Search code examples
htmlcsscss-selectorsandroid-browser

:not pseudo class not working on Android device


I have the following code in my CSS:

img:not(#some_image)    {
    margin-top:10px;
}

This CSS sets margin-top:10px; for every image, if it's not id="some_image".

This is working on many browsers. But on Android devices this gets ignored, means there's no margin-top:10px; at any image.

Is there a way to make the :not pseudo class working on Android devices? Or, do I have to set this style manually for every image that is not id="some_image"?


Solution

  • I finally found what I was doing wrong, since the :not pseudo class does work in Android browser.

    I had the following code:

    img:not(#some_image, #another_image)    {
        margin-top:10px;
    }
    

    But this is wrong syntax.

    The right way to exclude multiple elements is this:

    img:not(#some_image):not(#another_image)    {
        margin-top:10px;
    }
    

    Android seems to be more strict because it's only working if using the right syntax while many other browsers also work with the wrong syntax.