PDA

Click to See Complete Forum and Search --> : 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 (http://www.kinkyceleb.com/1261795520)
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 :)