Media queries is not working as expected(Responsive)

Hey,

I have used this plugin called https://wordpress.org/plugins/speakout/
For sign the petition in my site.
This is my site http://wowdesigns.in/projects/nesties/petition/

Well, in mobile view on tap of "read the petition" it all appear to be broken.
Could you please let me know how can I fix this?
tried a lot of ways, but no luck.

Kindly let me know.

Thanks

  • Predrag Dubajic

    Hey Harsha.wowd,

    Hope you're doing good :slight_smile:

    By "broken" you mean that the popup is going out of the page, right?

    It looks like the script is defining popup size but it doesn't work properly on smaller screens that are below 640 pixels.
    You should be able to fix it by using this CSS code:

    @media (max-width: 640px) {
        #dk-speakout-reader textarea {
            max-width: 100%;
        }
    
        #dk-speakout-reader {
            max-width: 100%;
            left: 0!important;
        }
    }

    Note that we usually try avoiding use of !important in CSS but since the position is determined by script there was no other way to overwrite it using CSS.

    Best regards,
    Predrag

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.