View Full Version : CSS on forms


yamachi01
08-15-2003, 09:25 PM
lately i've been going through and basically having css format everything on my site because i go through layotus so much.. anyways i think all i have to do now is make it format forms... but i don't know what to put. my css right now looks like this:

<style type="text/css">
<!-- body {
SCROLLBAR-FACE-COLOR : #B3C8EE;
SCROLLBAR-HIGHLIGHT-COLOR : #ffffff;
SCROLLBAR-SHADOW-COLOR : #6881B1;
SCROLLBAR-3DLIGHT-COLOR : #ffffff;
SCROLLBAR-ARROW-COLOR : #B3C8EE;
SCROLLBAR-TRACK-COLOR : #DAE3F5;
SCROLLBAR-DARKSHADOW-COLOR : #6881B1;
background-color: #DAE3F5;
font-family:verdana,arial;
letter-spacing:0pt; align:justify; line-height:14px; color:#000000; font-size:10; }
-->
</style>

<style type="text/css">
<!--
A:link
{color:#6881b1; text-decoration:none;}
A:visited
{color:#6881b1; text-decoration:none;}
A:active
{color:#6881b1; text-decoration:none;}
A:hover
{color:#ffffff; text-decoration:none; cursor:move;}
.a1:A:link
{background:#B3C8EE; border-style:solid; border-width:1px; border-top-color:#ffffff; border-bottom-color:#6881B1; border-left-color:#ffffff; border-right-color:#6881B1; color:#6881b1; text-decoration:none; width:100%; height:20px; text-align:center;}
.a1:A:visited
{background:#B3C8EE; border-style:solid; border-width:1px; border-top-color:#ffffff; border-bottom-color:#6881B1; border-left-color:#ffffff; border-right-color:#6881B1; color:#6881b1; text-decoration:none; width:100%; height:20px; text-align:center;}
.a1:A:active
{background:#B3C8EE; border-style:solid; border-width:1px; border-top-color:#ffffff; border-bottom-color:#6881B1; border-left-color:#ffffff; border-right-color:#6881B1; color:#6881b1; text-decoration:none; width:100%; height:20px; text-align:center;}
.a1:A:hover
{text-align:center; background:#B3C8EE; border-style:solid; border-width:1px; border-top-color:#6881B1; border-bottom-color:#ffffff; border-left-color:#6881B1; border-right-color:#ffffff; color:#ffffff; text-decoration:none; width:100%; height:20px; cursor:crosshair;}
-->
</stlye>

<STYLE type="text/css>
<!--
TABLE {font-family: verdana; line-height: 14px; font-size: 10px;}
TR {font-family: verdana; line-height: 14px; font-size: 10px;}
TD {font-family: verdana; line-height: 14px; font-size: 10px;}
-->
</style>

help is very much appreciated...

MaGiCSuN
08-15-2003, 10:53 PM
you can make your css like this:

<style type="text/css">
<!-- body {
SCROLLBAR-FACE-COLOR : #B3C8EE;
SCROLLBAR-HIGHLIGHT-COLOR : #ffffff;
SCROLLBAR-SHADOW-COLOR : #6881B1;
SCROLLBAR-3DLIGHT-COLOR : #ffffff;
SCROLLBAR-ARROW-COLOR : #B3C8EE;
SCROLLBAR-TRACK-COLOR : #DAE3F5;
SCROLLBAR-DARKSHADOW-COLOR : #6881B1;
background-color: #DAE3F5;
font-family:verdana,arial;
letter-spacing:0pt; align:justify; line-height:14px; color:#000000; font-size:10; }

A:link
{color:#6881b1; text-decoration:none;}
A:visited
{color:#6881b1; text-decoration:none;}
A:active
{color:#6881b1; text-decoration:none;}
A:hover
{color:#ffffff; text-decoration:none; cursor:move;}
.a1:A:link
{background:#B3C8EE; border-style:solid; border-width:1px; border-top-color:#ffffff; border-bottom-color:#6881B1; border-left-color:#ffffff; border-right-color:#6881B1; color:#6881b1; text-decoration:none; width:100%; height:20px; text-align:center;}
.a1:A:visited
{background:#B3C8EE; border-style:solid; border-width:1px; border-top-color:#ffffff; border-bottom-color:#6881B1; border-left-color:#ffffff; border-right-color:#6881B1; color:#6881b1; text-decoration:none; width:100%; height:20px; text-align:center;}
.a1:A:active
{background:#B3C8EE; border-style:solid; border-width:1px; border-top-color:#ffffff; border-bottom-color:#6881B1; border-left-color:#ffffff; border-right-color:#6881B1; color:#6881b1; text-decoration:none; width:100%; height:20px; text-align:center;}
.a1:A:hover
{text-align:center; background:#B3C8EE; border-style:solid; border-width:1px; border-top-color:#6881B1; border-bottom-color:#ffffff; border-left-color:#6881B1; border-right-color:#ffffff; color:#ffffff; text-decoration:none; width:100%; height:20px; cursor:crosshair;}

TABLE {font-family: verdana; line-height: 14px; font-size: 10px;}
TR {font-family: verdana; line-height: 14px; font-size: 10px;}
TD {font-family: verdana; line-height: 14px; font-size: 10px;}
-->
</style>

and for the form thing. Do you mean like input fields you want to give a border etc? it can be on two different ways:

1. put input in your css and see what changes. Mostly those are all the fields that start with <input>

input { codes in here }

2. you can make classes like this

.textarea { codes in here }

and then name your textarea in your form class="textarea" and so on.

Love,
Mirna

yamachi
08-16-2003, 03:44 AM
ok i'll do that.. thanks ^_^

yamachi
08-16-2003, 06:07 PM
ok thanks ^.^ i dont' think i have much left to add to the stylesheet :D thanks