PDA

View Full Version : .css question


Slater
03-26-2003, 03:56 PM
Ok. I want to change the input fields and buttons on at this link, but it affects the check boxes as well. How do I get just the input fields and buttons to change if possible?

Link (http://www.christianadams.com/php/guestbook/guestbook.php?act=new)

[Edited on 26-3-2003 by Slater]
Slater
03-26-2003, 05:49 PM
*bump*
torevaal
03-26-2003, 06:41 PM
Are you useing Dreamweaver??

-Tore
Slater
03-26-2003, 06:52 PM
Yes.
MinistryD
03-26-2003, 08:05 PM
Using dreamweaver will just make it worse, best way is to assign a style to each element via the code view.

Was going to explain it all but then I found a tutorial that will really help you and others in the future. :D

This is what you're after right? Making the form elements seperate styles? [example] (http://www.codeave.com/css/form-colors.htm)

[tutorial] (http://www.codeave.com/css/code.asp?u_log=4018)

Enjoy!! :roll
Slater
03-26-2003, 08:26 PM
I think that is what I am looking for. Course I am going to have to tweak it a little because it looks different compared to the normal tag sequence.

Here is what I have now:
<STYLE type="text/css">
<!--
BODY {
scrollbar-face-color: #4D5D6D;
scrollbar-highlight-color: #4D5D6D;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-darkshadow-color: #4D5D6D;
scrollbar-shadow-color: #4D5D6D;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #FFFFFF;
}
-->
</STYLE>
<STYLE TYPE="text/css">
<!--
A:link { text-decoration: none;
color: #666666;
font-family: Verdana; }
A:visited { text-decoration: none;
color: #666666;
font-family: Verdana; }
A:active {text-decoration: none;
color: #666666;
font-family: Verdana; }
A:hover {text-decoration: underline;
color: #CCCCCC;
font-family: Verdana; }input {
border: solid;
border-width: 1px;
border-color: #FFFFFF;
font-family: verdana;
font-weight: none;
color: #FFFFFF;
background-color: #9C9A9C;
font-size: 10px
}
option {
border: solid;
border-width: 1px;
border-color: #FFFFFF;
font-family: verdana;
font-weight: none;
color: #FFFFFF;
background-color: #9C9A9C;
font-size: 10px
}
select {
border: solid;
border-width: 1px;
border-color: #FFFFFF;
font-family: verdana;
font-weight: none;
color: #FFFFFF;
background-color: #9C9A9C;
font-size: 10px
}
Madman
03-28-2003, 09:32 PM
you&#039;ll want to put it all into one <style> tag, as Opera and Mozilla especially have some problems with two or more of one thing outside the <body> tags.

Like this:


<STYLE type=text/css>
<!-- // hide from stupid browsers
BODY {
scrollbar-face-color: #4D5D6D;
scrollbar-highlight-color: #4D5D6D;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-darkshadow-color: #4D5D6D;
scrollbar-shadow-color: #4D5D6D;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #FFFFFF;
}
A:link {
text-decoration: none;
color: #666666;
font-family: Verdana;
}
A:visited {
text-decoration: none;
color: #666666;
font-family: Verdana;
}
A:active {
text-decoration: none;
color: #666666;
font-family: Verdana;
}
A:hover {
text-decoration: underline;
color: #CCCCCC;
font-family: Verdana;
}
input {
border: solid;
border-width: 1px;
border-color: #FFFFFF;
font-family: verdana;
font-weight: none;
color: #FFFFFF;
background-color: #9C9A9C;
font-size: 10px
}
option {
border: solid;
border-width: 1px;
border-color: #FFFFFF;
font-family: verdana;
font-weight: none;
color: #FFFFFF;
background-color: #9C9A9C;
font-size: 10px
}
select {
border: solid;
border-width: 1px;
border-color: #FFFFFF;
font-family: verdana;
font-weight: none;
color: #FFFFFF;
background-color: #9C9A9C;
font-size: 10px
}
-->
</style>


[Edited on 28-3-2003 by Madman]