Adjust width of input fields

[Magicmarker]

http://chicacafe.redwebtestsite.com

My login fields are too wide. Where do I shorten those?

[toddz88]

I added this to my theme's main CSS file. It makes the input fields 300px wide, but you can adjust to your needs. The Select element is separate, since it should not get the padding and font-size too.

Code: Select all

/* input fields should not be 100% wide  */
form div.s2member-pro-paypal-form-section > div.s2member-pro-paypal-form-div input[type="text"],
form div.s2member-pro-paypal-form-section > div.s2member-pro-paypal-form-div input[type="password"],
form div.s2member-pro-paypal-form-section > div.s2member-pro-paypal-form-div textarea
{
   width: 300px;
   padding: 3px;
   font-size: 1em;
}
form div.s2member-pro-paypal-form-section > div.s2member-pro-paypal-form-div select {
   width: 300px;
}

[Magicmarker]

Seemed to have no effect (?).

[toddz88]

You need to change the css selectors to target the specific elements you want to effect. On your site, try

Code: Select all

form#loginform input#user_login,
form#loginform input#user_pass {
width: 260px;
}

but since I see those elements have inline style="width: 100%", you might need to override it with

Code: Select all

width: 260px !important

[Magicmarker]

Yes, I had to add the second suggestion as well but it worked! Thank you for your time!!