The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Display none don't work in Safari

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #277179

    Hi everyone, please I need your help.
    I have this html code (is a plugin of wordpress, so i can’t modificate it).

    -Solapar citasCarlos

    How you can see, in this plugin there are a dinamic form.

    Right, What I want to do?

    I would like hide the option value 2 (Solapar citas) and I want show the option value 1 (Carlos). I put the code:
    select.filter.form-control option[value=”2″]{
    display: none;}

    This work for Chrome, Mozilla, Opera.. But the problem is this option don’t work for Safari in Mac :(

    I try to put that code:
    select.filter.form-control option[value=”2″]{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    bottom: 0;
    opacity: 0;

    But the result is the same….

    Can someone helpme to write a code for hide the option value 2 and work well in Safari, Chrome, Mozilla, etc.?

    Thank you so much.


    Your code is incomplete so I can’t give any concrete answer. I also don’t use WordPress in order to hazard a direct guess. BUT…

    Are you asking about Safari on iOS?

    I say that because I’m aware of Joomla form plugins where JavaScript identifies Safari on iOS in order to modify the HTML for mobile, so the markup that you see on desktop isn’t the same as when viewed via iPhone/iPad. Consequently, the element that you’re trying to target with desktop CSS might not even exist in Safari iOS.


    AFAIK it’s not possible using CSS, Safari doesn’t allow styling the options, only the select container. But you can remove and add options using javascript. See also:

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.