Jump to content

form css help


pleek

Recommended Posts

ok so i have a css template that i want to edit. The body has a background color and it changes the form buttons and fields to. If i delete the body background css it fixes the buttons but then messes up the rest of the theme. How do i set the forms to be just regular and not like the body?

Link to comment
Share on other sites

Post the css and explain in english what u want to do. Im not getting what has <body> to do with <inputs>

 

Basically, u must have:

body{
    background-color:#ddd;
}

input{
    background-color:red;
    border:1px solid green;
}

Link to comment
Share on other sites

The body has a background color and it changes the form buttons and fields to.

 

Changes them to what? You left out a word there at the end.

 

You don't by chance have:

 

*{
   margin: 0;
   padding: 0;
}

 

in your code do you? That will screw up form elements.

Link to comment
Share on other sites

/* By default (td, body..) use verdana in black. */
body, td, th , tr
{
color: #000000;
font-size: small;
font-family: verdana, sans-serif;
}

/* The main body of the entire forum. */
body
{
background-color: #E5E5E8;
margin: 0px;
padding: 0px 30px 4px 30px;
}

/* Input boxes - just a bit smaller than normal so they align well. */
input, textarea, button
{
color: #000000;
font-family: verdana, sans-serif;
}
input, button
{
font-size: 90%;
}

textarea
{
font-size: 100%;
color: #000000;
font-family: verdana, sans-serif;
}

/* All input elements that are checkboxes or radio buttons. */
input.check
{
}

/* Selects are a bit smaller, because it makes them look even better . */
select
{
font-size: 90%;
font-weight: normal;
color: #000000;
font-family: verdana, sans-serif;
}


 

That is the body and form css that i have. If i take out the background color of the body, it fixes the forms to look like normal but then the rest of the theme is messed up.

 

what it looks like now

1211525358.bmp

 

What i want it to look like (how it looks normally

1211527508.bmp

Link to comment
Share on other sites

Got a link?

 

One thing I should tell you, form elements are about the hardest thing there is to style with CSS. They react very differently in different browsers, so it's pretty hard to get anything that is consistent across each browser.

Link to comment
Share on other sites

You can fix that by adding this to your CSS (lower than your other input and text area declarations)

 

input, textarea
{
   background-color: #FFF;
}

 

Although to be honest, I prefer it the way you have it now! I tried out your site with the inputs the way you want to do it (using the above code), and I think the look you have no matches your site theme better. But, it still looks fine even if you set the inputs to white, so either way is all good.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.