Search code examples
javascriptjqueryhtmlcssphotoswipe

Overriding HTML CSS element


I have recently added a Photoswipe gallery to my website which has the following CSS applied to it:

html {overflow-y:scroll;overflow-x:auto;}

Now the problem is the full-screen gallery scrolls because of this overflow, but it should fit tight to the screen it's shown on, no scrolling. I don't want to remove it using jQuery as I was having problems with jQuery on this page.

I tried:

<style type="text/css">
html {}
</style>

With no luck. What else can I do to remove it?


Solution

  • You can try this for example:

    <style type="text/css">
    html 
    {
    overflow-y:auto !important;
    overflow-x:auto !important;
    }
    </style>