Contact Form 7: Style Issue

Hi,
Its’simple as you have styled other input types as visible from the line 208 in your style.css

the one field that you are talking about is input[type=”email”]
which you have to add to the 208th line like the rest to have it styled like the other fields, currently there is no style definition for that so its appearing as it is now.

Thanks for getting back to me.

I’m still confused. Even when I delete every single line of my custom CSS, the problem persists. I don’t even know how I’ve styled the other parts as I have. I thought it was the following CSS:

.entry, #respond, {
border-bottom: none;
box-shadow: none;
border-radius: 5px;
}

But when I delete that and update, it remains the same.

Help!

In your style.css file on line 208 you have:

input[type="text"],input[type="password"], textarea {
    background: none repeat scroll 0 0 #FCFCFC;
    border: 1px solid #EEEEEE;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.05) inset;
    color: #999999;
    font-family: "Droid Sans",sans-serif;
    font-size: 13px;
    padding: 1.5%;
}

you just need to add input[type="email"] in between this like:

input[type="text"],input[type="email"],input[type="password"], textarea {
    background: none repeat scroll 0 0 #FCFCFC;
    border: 1px solid #EEEEEE;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.05) inset;
    color: #999999;
    font-family: "Droid Sans",sans-serif;
    font-size: 13px;
    padding: 1.5%;
}

that will style your email field also similar to the others.

Well spotted! That was an issue with the parent them CSS file, not my own – hence me struggling to find it.

Thanks, appreciate your help.

cheers..:)

Pls close this thread if the issue is resolved

Resolved.

I am having a similar issue as above, but it is within the Contact 7 form that is inserted within UberMenu

https://norvelltanning.com/temp2013/here/

Under the “About Us” tab in the main navigation.

The Email field is too long and is not formatting correctly, and I cannot for the life of me figure out where to add the code to override the format of the “email” field.

Any assistance would be greatly appreciated.

Thank You
Kristi

Hi,
Its’ the same issue here also../you have not specified any style for
input[type="email"]
that is why email field is appearing un-formatted.
Define a style in your stylesheet of child theme alongside input[type="text"] and you will be good to go…

Cheers..:)…

Yep, looks exactly like the problem I had… What theme are you using?

Try the advice I was given… add

input [type=”email”]

to the relevant line of CSS. The thing that confused me initially was that it was the parent theme code that was incorrect, not my child theme (as I expected), so make sure you check that!

Hope that helps.

ok so I have added the following to the style.css and the custom_styles.php

.widget input[type=email],

and it is now formatted correctly, but the border is a different color and I cannot for the life of me figure out why it is yellow and the others are grey… any thoughts?

About Us tab in ubermenu
https://norvelltanning.com/temp2013/here/

Hi the border color for all the input boxes is coming from line 991 of basic.css file.
You have to add input[type="email"] there also to change the yellow border for the email field.
that should solve your problem.

cheers..:)..