• Hi Rohit!

    I am experiencing a problem with my stylesheet
    http://hannasles.com/profile/, Professional Profile section. I would like to customize bullets:
    li{
    padding-left:20px !important;
    background: url(‘wp-content/uploads/2014/06/bullet.png’) no-repeat 5px 8px transparent !important;
    font-family:’Conv_Cambria Italic’ !important;
    font-size:15px !important;
    line-height:25px !important;
    list-style: none !important;
    }

    but when I check i see, that user agent stylesheet overrides it.

    what do you think how to block overriding the user agent stylesheet? I heard that it is possible in function.php

    thank you for your answer!

Viewing 2 replies - 1 through 2 (of 2 total)
  • You can’t disable the user stylesheet because it resides locally on everyone’s computer. The user stylesheet has default styles that are used in case the web developer didn’t include any CSS. If your CSS isn’t being applied correctly, then chances are there is a syntax error upstream from that particular rule that is preventing the browser from interpreting it.

    First of all, you should not have to use the !important clause for the list items. In fact, it’s a very bad idea in this case, because there are a lot of structures, like menus, which uses unordered lists and list items. The only time you need to use !important is for very special cases, like overriding inline CSS. You should use class names and IDs for your selectors, like this:

    .gray-box li {
       padding-left:20px;
       background: url('/wp-content/uploads/2014/06/bullet.png') no-repeat 5px 8px transparent;
       font-family:'Conv_Cambria Italic';
       font-size:15px;
       line-height:25px;
       list-style: none;
    }

    Second, you should not edit the theme’s style.css file directly because your changes will be lost the next time the theme gets upgraded, either because of feature enhancements or security patches. Use a CSS plugin like JetPack or Custom CSS Manager.

    Lastly, the problem is due to a missing right brace } just before your rule, which closes off the media query above it. Add that right brace back in and your rule should work, but make the changes that I suggested above. Oh, and you need to add a backslash to the front of the url value as I’ve done above in the code box.

    Thread Starter asles

    (@asles)

    thank you very much for your help!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘how to disbale user agent stylesheet’ is closed to new replies.