Docs

[Advasa]

Hello,

I am trying make the contact form in my header widget styled different to the other contact forms on my site.

I have used the form id and put some custom css in but not luck.
This is the code i currently have:

.wpcf7-f5-o2 .wpcf7 {
background-color: #fff;
padding: 5px 20px 5px 20px;
border-radius: 8px
}

Can you see what I have done wrong?

Thanks

Justin

[Advasa]

This reply has been marked as private.

[Lely]

This reply has been marked as private.

[Advasa]

This reply has been marked as private.

[Advasa]

Also for some reason the text in my contact forms are aligning to the center, how can I make it align to the left?

Thanks

Justin

[Christopher]

Hi there,

The CSS is working fine.
If you want to apply style to widgetbar, please update your code to :

.x-widgetbar .wpcf7 input,.x-widgetbar .wpcf7 textarea {
    width: 100%;
    padding: 10px;
    color: #000000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 20px;
    border: solid 1px #9f9f9f;
    box-shadow: inset 2px 2px 8px #bababa;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    border-radius: 8px;
}

Clear cache and check again.

Hope it helps.

[Author]

Posts