Support » Plugin: Smart Grid-Layout Design for Contact Form 7 » Custom CSS

Custom CSS

  • Resolved mstudioIL

    (@mstudioil)


    1 month, 3 weeks ago

    I want to change the style of the submit button but my custom css is not working
    I used
    .main-contact-home .cf7-smart-grid.has-grid .wpcf7-submit{height:40px !important;padding:5px !important;background:#5eaadc !important;border:0 !important;}
    but it is not working
    How I control the style of the elements?

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Aurovrata Venet

    (@aurovrata)

    1 month, 3 weeks ago

    I want to change the style

    the style is set by your theme. The plugin only affects the layout of the form.

    Please request assistance with your theme developer.

    Thread Starter mstudioIL

    (@mstudioil)

    1 month, 3 weeks ago

    This code control the submit button and I can’t change it

    .cf7-smart-grid.has-grid .wpcf7-submit {
    background: #383838;
    border: solid 1px #383838;
    border-radius: 3px;
    font-size: 110%;
    font-weight: 700;
    color: #fff;

    I using Polylang and “Contact Form 7 Polylang extension” for the translation and need this plugin to use “Contact Form 7 Polylang extension”
    How can I overwrite this code, my theme is OceanWP and it didn’t control the style,
    I also use Elementor and it also don’t control the style.
    I set the style do want I needed and it still not working

    this is the link to the site:
    https://ammonite.co.il/newsite/

    the form is near the end of page

    it work only when I added custom CSS in the form and not used style.css from my child theme

    • This reply was modified 1 month, 3 weeks ago by mstudioIL.
    • This reply was modified 1 month, 3 weeks ago by mstudioIL.
    Plugin Author Aurovrata Venet

    (@aurovrata)

    1 month, 3 weeks ago

    This code control the submit button

    a few elements are indeed styled by the plugin , but the CSS rules used are very low priority and most themes override these.

    this is the link to the site:
    https://ammonite.co.il/newsite/

    but your style is working, since it is being applies on the form submit:

    
.cf7-smart-grid.has-grid .wpcf7-submit {
	height: 40px !important;
	padding: 5px !important;
	background: #5eaadc !important;
	border: 0 !important;
}

    although if you used a higher priority CSS rules you wouldn’t need to use the ‘!important’ directive.

    it work only when I added custom CSS in the form and not used style.css from my child theme

    this all depends on how your style.css is being loaded and its dependencies.

    You need to ask a WordPress developer to fix your stylesheet loading priorities.

    Alternatively, use the custom CSS editor in the form editor, the plugin will then manage your stylesheet is loading priority.

    Plugin Author Aurovrata Venet

    (@aurovrata)

    1 month ago

    I am assuming this issue is solved.

    Thread Starter mstudioIL

    (@mstudioil)

    1 month ago

    It is OK, thanks

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.

Views