Title: CSS Rule
Last modified: October 10, 2021

---

# CSS Rule

 *  [mallyz](https://wordpress.org/support/users/mallyz/)
 * (@mallyz)
 * [4 years, 8 months ago](https://wordpress.org/support/topic/css-rule/)
 * Hi [@aurovrata](https://wordpress.org/support/users/aurovrata/),
 * I added this code you gave me for the slider
 *     ```
       .cf7sg-collapsible.glider-slide:not(.visible) {
         height: 0 !important;
       }
       ```
   
 * It seems to work only in firefox browser (desktop & mobile), in chrome/edge (
   desktop & mobile) ect it works on only the first slide, then it doesn’t show 
   the rest of the slides. it changes the slide but the slide doesn’t adjust so 
   you cannot see the information.
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fcss-rule%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 7 replies - 1 through 7 (of 7 total)

 *  Thread Starter [mallyz](https://wordpress.org/support/users/mallyz/)
 * (@mallyz)
 * [4 years, 8 months ago](https://wordpress.org/support/topic/css-rule/#post-14956175)
 * Actually it seems to be working on desktops just not on mobile browsers.
 *  Thread Starter [mallyz](https://wordpress.org/support/users/mallyz/)
 * (@mallyz)
 * [4 years, 8 months ago](https://wordpress.org/support/topic/css-rule/#post-14956297)
 * Also is there a way to make the scroll to top of page on prev & next? not scroll
   to top of form as it does now.
 * Regards
 *  Thread Starter [mallyz](https://wordpress.org/support/users/mallyz/)
 * (@mallyz)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/css-rule/#post-14964151)
 * Hi [@aurovrata](https://wordpress.org/support/users/aurovrata/),
 * Here is a link to see what is happening:
    [Inspection Form Error](https://photos.app.goo.gl/1EfHtZsoQGf1fmz1A)
 * Regards
 *  Thread Starter [mallyz](https://wordpress.org/support/users/mallyz/)
 * (@mallyz)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/css-rule/#post-14964444)
 * Hi [@aurovrata](https://wordpress.org/support/users/aurovrata/)
 * It seems the problem is due to Android 12 beta release and nothing to do with
   the script.
 * Sorry about that, the only question I have now is can we make the next prev button
   scroll to top of page #header and not to top of form?
 * Regards
 *  Plugin Author [Aurovrata Venet](https://wordpress.org/support/users/aurovrata/)
 * (@aurovrata)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/css-rule/#post-14969141)
 * Hi [@mallyz](https://wordpress.org/support/users/mallyz/)
 * sorry, I was travelling for the last week and could not answer.
 * > It seems the problem is due to Android 12 beta release and nothing to do with
   > the script.
 * are you referring to the CSS style to adjust the size of each slide? It is working
   on all devices, including chrome?
 * > I have now is can we make the next prev button scroll to top of page #header
   > and not to top of form?
 * for now you will need to fire your own sroll event when the event `'glider-slide-
   visible'` is fired by the slider on the `div.glider` slide container.
 *  Thread Starter [mallyz](https://wordpress.org/support/users/mallyz/)
 * (@mallyz)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/css-rule/#post-14969187)
 * Hi [@aurovrata](https://wordpress.org/support/users/aurovrata/)
 * > are you referring to the CSS style to adjust the size of each slide? It is 
   > working on all devices, including chrome?
 * Yes it is working across all devices expect some android devices as you can see
   in the video below
 * Here is a link to see what is happening:
    [Inspection Form Error](https://photos.app.goo.gl/1EfHtZsoQGf1fmz1A)
 * > for now you will need to fire your own sroll event when the event `'glider-
   > slide-visible'` is fired by the slider on the `div.glider` slide container.
 * Also I’m not very good with CSS but I will look into the information you have
   supplied me and try to figure out the coding.
 * Thankyou very much for your reply and I hope you had a good break.
 * Regards
 *  Plugin Author [Aurovrata Venet](https://wordpress.org/support/users/aurovrata/)
 * (@aurovrata)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/css-rule/#post-14969270)
 * > Also I’m not very good with CSS but I will look into the information you have
   > supplied me and try to figure out the coding.
 * it’s javascript 🙂 You’ll need to do a tutorial on [JQuery Event handling](https://www.tutorialsteacher.com/jquery/jquery-event),
   especially JQuery’s on() method which allows you to execute custom code when 
   the ‘glider-slide-visible’ event is triggered on the `$('div.glider')` element.

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘CSS Rule’ is closed to new replies.

 * ![](https://ps.w.org/cf7-grid-layout/assets/icon-256x256.png?rev=1834229)
 * [Smart Grid-Layout Design for Contact Form 7](https://wordpress.org/plugins/cf7-grid-layout/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/cf7-grid-layout/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/cf7-grid-layout/)
 * [Active Topics](https://wordpress.org/support/plugin/cf7-grid-layout/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/cf7-grid-layout/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/cf7-grid-layout/reviews/)

 * 7 replies
 * 2 participants
 * Last reply from: [Aurovrata Venet](https://wordpress.org/support/users/aurovrata/)
 * Last activity: [4 years, 7 months ago](https://wordpress.org/support/topic/css-rule/#post-14969270)
 * Status: not resolved