WPForms – Center Text within Confirmation Message

  • Hello!

    I haven’t been able to find any topics on this. I’m trying to add additional CSS to center the text displayed in the confirmation message box from my WPForm. Right now, the text has a default left alignment within the colored background/box. I’m very new at CSS and I’m still learning. This is the CSS I already have for my confirmation message:

    .wpforms-confirmation-container-full {
    color: #FFFFFF;
    background: #29537c;
    border: 3px solid #808080;
    padding: 15px 15px;
    }

    Thanks in advance!

    • This topic was modified 4 years, 3 months ago by t-p. Reason: Moved to Fixing WordPress from Developing with WordPress

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

Viewing 1 replies (of 1 total)

  • Hello Breigh!

    Happy to help!

    The CSS class for the WP Forms confirmation message is:

    .wpforms-confirmation-container-full, div[submit-success] > .wpforms-confirmation-container-full:not(.wpforms-redirection-message)

    So you need to use that CSS class as follows:

    .wpforms-confirmation-container-full, div[submit-success] > .wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
background: #29537c;
border: 3px solid #808080;
padding: 15px 15px;
text-align: center;
}

.wpforms-confirmation-container-full, div[submit-success] > .wpforms-confirmation-container-full:not(.wpforms-redirection-message) p {
color: #FFFFFF;
}

    I added “text-align: center;” to your code. That will align the text in the center of the confirmation message.

    I also wrote a second CSS snippet because the text is inside a paragraph tag (“<p>”). The color won’t change to white unless you target that “<p>” tag directly.

    Please let me know if this code works.

    • This reply was modified 4 years, 3 months ago by Niall Madhoo.
Viewing 1 replies (of 1 total)
  • The topic ‘WPForms – Center Text within Confirmation Message’ is closed to new replies.