Customizing Confirmation Box with CSS not doing anything

Resolved

maja2019

(@maja2019)

I’ve been trying to make a specific WPForm confirmation box more visible on the top of the background image with CSS:

#wpform-119 div.wpforms-confirmation-container-full, div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
	color: #333 !important;
	margin: 0 0 24px 0 !important;
	background: #e0ffc7 !important;
	border: 1px solid #b4d39b !important;
	padding: 15px 15px !important;
}

I also tried:

#wpform-119 .wpforms-confirmation-container-full, div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
	color: #333 !important;
	margin: 0 0 24px 0 !important;
	background: #e0ffc7 !important;
	border: 1px solid #b4d39b !important;
	padding: 15px 15px !important;
}

Or just:

#wpform-119 .wpforms-confirmation-container-full {
	color: #333 !important;
	margin: 0 0 24px 0 !important;
	background: #e0ffc7 !important;
	border: 1px solid #b4d39b !important;
	padding: 15px 15px !important;
}

But still it didn’t work. The box didn’t change at all and is hardly visible at all. What am I doing wrong please?

I’m using W ordPress 6.2 and Astra Child Theme.

I used the help from Changing the Background Colour of the Confirmation Box | ww.wp.xz.cn

And Styling WPForms With Custom CSS (Beginner’s Guide)

Thanks so much in advance!!

The page I need help with: [log in to see the link]

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

Thread Starter maja2019
(@maja2019)

3 years ago

Also the version of WPForms Lite is 1.8.1.2

I have found that this might be a problem: Why Your Custom CSS Doesn’t Work in WordPress and How to Fix It – The Media Temple Blog

There it says that adding the code it to my child theme dependencies, like this, should resolve the problem:

wp_enqueue_style( ‘total-child-css’,
get_stylesheet_directory_uri() . ‘/style.css’, array(‘total-parent-css’, ‘reaction_buttons_css’), ‘1.0’, all );

Do you agree? And what does he mean by child theme dependencies? Where exactly am I supposed to add the code given my version of WP?

Thanks so much again!!!
Prashant Rai
(@prashantrai)

3 years ago
Hey @maja2019 – Thanks for reaching out!

It looks like there could be a styling conflict between the site theme and the forms. To fix this, please try the following custom CSS snippet:
```
div#wpforms-183 .wpforms-confirmation-container {
    background-color: #b7c956 !important;
    padding: 30px;
    border: 1px solid #9ea70b !important;
}

div#wpforms-183 .wpforms-confirmation-container p {
    color: #000 !important;
}
```
And in case it helps, here’s a tutorial on how to add custom CSS like this to your site.

Hope this helps!
Prashant Rai
(@prashantrai)

3 years ago

Hey @maja2019 – We haven’t heard back from you since my previous message, so I’m going to go ahead and close this thread for now. But if you’d like us to assist further, please feel welcome to continue the conversation.

Thanks!

Thread Starter maja2019
(@maja2019)

3 years ago

Huge thanks! That worked! 🙂

Prashant Rai
(@prashantrai)

3 years ago

Hey @maja2019 – I’m thrilled to hear that the snippet worked for you, and thanks for letting us know.

If you have any questions, please feel free to reachout.

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

The topic ‘Customizing Confirmation Box with CSS not doing anything’ is closed to new replies.