CSS Bug with buttons

  • Resolved greenrooster

    (@greenrooster)


    3 years, 1 month ago

    Hello,

    There seems to be some unintended css clashing between an inline style and a stylesheet style. When a default style form has pagination, the div (.forminator-pagination-footer) encapsulating the “Previous” and “Next” button has an inline style of “display:flex;”. When the max-width media query of the div is reached, the stylesheet (forminator-form-default.pagination.min.css) expects that the div becomes “display:block;” according to “.forminator-ui.forminator-custom-form[data-design=default] .forminator-pagination-footer”. The inline style is overwriting the stylesheet and causing some funkiness.

    Thanks.

    • This topic was modified 3 years, 1 month ago by greenrooster.
Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Support Nithin – WPMU DEV Support

    (@wpmudevsupport11)

    Hi @greenrooster,

    I could notice what you have mentioned, within the source code. I’m bringing this to our Forminator developer’s attention to check the workflow regarding this. Will keep you updated once we get further feedback.

    However, I wasn’t able to notice any issues with the layout, on how it loads. Could we know what exactly you meant by “funkiness”? Any screenshot that you could share regarding this?

    Kind Regards,
    Nithin

    Plugin Support Nithin – WPMU DEV Support

    (@wpmudevsupport11)

    Hi @greenrooster,

    On checking further, seems like the issue is more visible once we go past the 1st pagination, I was able to notice the issue as you have pointed.

    I’m marking this as a bug, and bringing it to our Forminator Teams attention so that this could be fixed asap.

    In the meanwhile, you can try the following CSS and see whether that helps:

    @media screen and (max-width: 768px) {
   
   .forminator-ui.forminator-custom-form[data-design=default] .forminator-pagination-footer {
	display: block !important;
	}

}

    You can add the CSS via the default WordPress customizer, under Appearance > Customize > Additional CSS.

    Thanks for bringing this to our attention. Really appreciate.

    Kind Regards,
    Nithin

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘CSS Bug with buttons’ is closed to new replies.