CSS question - help required!

**laTortuga** · 02-27-2003 06:13 PM

Hello

I have the following in my <HEAD></HEAD> tags:

<style>
.searchbox {
border:solid 1 D38F50;
font-family: verdana,arial,helvetica;
font-size: 8pt;
background-color: black;
COLOR: white;
font-weight: medium;
}
</style>

and further down the page, I have:

<p><input type="submit" name="submit" class="searchbox" value="Submit" size="6"></input>

<input type="reset" name="clear" class="searchbox" value="Reset" size="6"></input>
</p>

If I change the colour value in the style tag (COLOR: white

to say, RED, the colour of the 'Submit', and 'Reset' buttons changes to red, and so does the colour of the text the user types in the form.

Is it possible to change the colour of the words 'Submit' and 'Reset', while maintaining the colour white as the colour of the text in the form's fields?

Many thanks for any help.

laTortuga

**toicontien** · 02-27-2003 08:01 PM

It's easy. Just make a separate class for the text box:

<style type="text/css" media="screen">
.searchbox {
border:solid 1 D38F50;
font-family: verdana,arial,helvetica;
font-size: 8pt;
background-color: black;
COLOR: #0f0;
font-weight: medium;
}

.AtextBox {
border:solid 1 D38F50;
font-family: verdana,arial,helvetica;
font-size: 8pt;
background-color: black;
COLOR: white;
font-weight: medium;
}

AND IN HTML:

<p><input type="submit" name="submit" class="searchbox" value="Submit" size="6">

<input type="reset" name="clear" class="searchbox" value="Reset" size="6">
</p>

<p>
<input type="text" class="AtextBox" size="30">

The input tag does not have an end tag. If you are coding in xhtml, just add a space and a forward-slash at the end of the input tag:

<input type="button" value="Stuff" />

**Stefan** · 03-01-2003 02:10 AM

Originally posted by laTortuga
border:solid 1 D38F50;

I'd like to mention that you have no less then 2 errors in that line.

#1 You MUST specify a unit with your width. You probably want 1px

#2 D38F50 is an invalid color. Again you need a unit. If it'a a hexvalue it should be #D38F50

To sum it up use eg
border:solid 1px #d38f50;

Also worth mentioning is that you shold always end a list of fonts with a generic fontfamily eg:
font-family: verdana,arial,helvetica,sans-serif;

and the use of points for fontsizes should only be used for media PRINT, not media SCREEN.
For stuff that is supposed to be displayed on a monitor, use pixel or preferably % eg
font-size: 80%;

celebguy_dv · 03-04-2003 03:09 AM

http://banners.dollarmachine.com/pic/2014000/hal001.gif

**laTortuga** · 03-04-2003 02:41 PM

Hello Stefan and Greg

Many thanks for both your postings - I'm grateful.

I didn't know I had to use:

border:solid 1px #d38f50;

so thanks for tidying up the existing code and offering more good stuff!

Cheers!

laTortuga

**Stefan** · 03-05-2003 04:52 AM

You are welcome

Thread: CSS question - help required!

Thread Tools

Display

CSS question - help required!

Re: CSS question - help required!

Many thanks

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions