Child theme .css not working

Hi there,
I can see some custom CSS applied to the contact form widget in the right sidebar on your site.
Where it comes from now? (child-theme or Additional CSS).
Did you clean your browser cache AND your w3tc plugin cache?

Best

The contact form in the sidebar is what I am formatting. CSS currently is in child theme and is not working. When I transfer it to Additional CSS it works. I think the custom CSS you may see is the default CSS of the contact form plugin over-riding the standard Customizr settings.

I’ve cleared all caches: W3, browser and host.

This is the custom CSS that I’m using and works only in Additional CSS

.wpcf7-form
{
    background-color: #27cda5;
    border-radius: 10px;
    border: 2px solid gray;
    padding-left: 10px;
    padding-top: 10px;
    line-height: 4px;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea
{
	border-radius: 7px;
	width: 90%;
}
input.wpcf7-form-control.wpcf7-submit {
    background: #008B8B;
    margin-left: auto;
	margin-right: auto;
	width: 90%;
}

BTW I’ve been using the child theme from the customizr website with quite a few customizr themed sites for several years and never had this problem. In fact I use almost this identical code on 2 other sites in the child theme without issues.

What I see is this:

View post on imgur.com

So I guess I can see it styled that way because of the additional CSS and not the child-theme style.css?!

The code above works fine here.

Anyway understanding what’s going wrong in your child-theme is not easy to do as long as you have the w3tc concatenating the styles :/. Could you disable it so that one can clearly see the child-theme style.css?

Thanks

The CSS is currently in the child theme and I can only assume you are seeing a cached version or something??? I have viewed this on several different devices and am getting the form with the default gray background.

This is the complete child css file. The first section as structured by nikeo followed by the css I previously posted. I have several other websites using exactly this format with no issues.

/*
Theme Name:     Customizr Child
Theme URI:      https://themesandco.com/customizr
Description:    A child theme for the Customizr WordPress theme. This child theme simply includes 2 files : style.css to add your custom css and functions.php where you can extend Customizr's core code. In order to keep your code as clean and flexible as possible, try to use Customizr's hooks API for your customizations. Do something awesome and have fun !
Author:         Nicolas Guillaume (nikeo)
Author URI:     https://themesandco.com
Template:       customizr
Version:        1.0.0
*/

/* Your awesome customizations start right here !
-------------------------------------------------------------- */

.wpcf7-form
{
    background-color: #27cda5;
    border-radius: 10px;
    border: 2px solid gray;
    padding-left: 10px;
    padding-top: 10px;
    line-height: 4px;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea
{
	border-radius: 7px;
	width: 90%;
}
input.wpcf7-form-control.wpcf7-submit {
    background: #008B8B;
    margin-left: auto;
	margin-right: auto;
	width: 90%;
}

I understand,
well that’s what I see, clearing the browser cache, using different browsers etc.
Also your child-theme has no errors as far as I can see.
Actually I now can see that the style above is both in the additional CSS box and in the child-theme style.css (concatenated and minified with w3tc).

Anyway the issue isn’t related to the theme, the child-theme style.css is correctly loaded, which is the only thing that the parent theme “does”.