Custom CSS for Contact Form 7

Resolved anouilh
(@anouilh)

16 years ago

Hi everyone,

This question may sound really daft but I’m having problems making the Contact Form 7 look right on our website. I don’t know much about CSS but I think that is what is causing the Contact Form to look the way it does, for example the submit button doesn’t look like a normal html button as it shows up in a black box with highlightable text which is also cut in the middle so you can’t make out the word ‘submit’.

Since I’m a real n00b at these things, I wanted to ask what to do to make Contact Form 7 to follow another CSS stylesheet, like with the CSS that comes from the default WordPress Theme ‘Kubrick’ so the Contact Form will hopefully display correctly.

Thanks in advance!

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

esmi
(@esmi)

16 years ago

A link to your Contact page would help.

skylar_inmotion
(@skylar_inmotion)

16 years ago

Yeah, a link will definitely help. The CSS that’s packaged with Contact Form 7 is pretty sparse and mostly used to give the input fields border colors.

wp-content/plugins/contact-form-7/styles.css

It’s possible that the form is inheriting styles from your theme.

pixel jockey
(@pixel-jockey)

15 years, 2 months ago

I know this is an older topic but might help someone out at a later date. The contact form does in inherit the styles of your theme. So if you want to style your form you can use something like this to style the form.

input[type=”text”] {

border: 1px #CCC solid;
font-size: 14px;

}

thealchemist
(@thealchemist)

15 years, 2 months ago

I have a form where everything is all fine and dandy up until a “textarea” … which, being white-on-white no one sees.

I too your css and modified it thusly

input[type=”textarea”] {

border: 1px #CCC solid;

}

to no avail. I can not find ANY code in the site’s css that regards forms and text areas.

http://174.122.140.200/~comforta/online-services/schedule-service-repair

Ideas?

Aaron

thealchemist
(@thealchemist)

15 years, 2 months ago

Nevermind. I forgot to open my eyes. Sheesh.

lylehebel
(@lylehebel)

15 years, 2 months ago

@thealchemist we all have been there.

optiquep
(@optiquep)

15 years, 1 month ago

Could someone help me. I need to change the font to a darker colour as the white font on my background is hard to see. I am very new at this so would like an easy simple explanation. Many thanks in advance.