Athen
Member
Hi there!
Love the form, so clever ;)
I have a issue on my site, all the fields are styled correctly, except two fields? I really don't get it, have been looking with firebug, but cannot find anything making a difference?
Have a look: http://aspeakers.ondesign.dk/speakers/soulaim-gourani/ (bottom of page)
Those are the HTML 5 field types ( tel & email ) and it looks like your theme doesn't have styles for them. You can either turn off the HTML5 option in your form settings, or edit the existing style rules to your theme stylesheet to support them.
starting around line 110 of your style.css file has this..
[css]
input[type="text"],
input[type="password"],
textarea {
background-color: #F6F6F6;
border-color: #CCCCCC #EFEFEF #EFEFEF #CCCCCC;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-style: solid;
border-width: 1px;
font-size: 12px;
padding: 9px 12px;
}
input[type="text"]:focus,
input[type="password"]:focus,
textarea:focus {
background-color: #FFFFFF;
}you can edit that and add the new input types to the rule like this..
[css]
input[type="text"],
input[type="url"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
textarea {
background-color: #F6F6F6;
border-color: #CCCCCC #EFEFEF #EFEFEF #CCCCCC;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-style: solid;
border-width: 1px;
font-size: 12px;
padding: 9px 12px;
}
input[type="text"]:focus,
input[type="url"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
textarea:focus {
background-color: #FFFFFF;
}That should get you rolling..
screenshot: http://bit.ly/pccIk3
Oh, I just noticed that you're using a WooTheme so you might have to add those new rules to the end of your custom.css file rather than editing the style.css file. I think they discourage editing the default and provide the custom.css just for that purpose.