PhP button

[Luzer]

how would i make an button and an text field that dont have the outline around it, like this one http://www.airideas.com/php_button.jpg

and how would i make the textfield go blank when it gets clicked on(for an forum? java script?\

tnx-luzer

[HTML]

The button is 100% CSS, for the textarea, check out Deans CSS tutorials http://css.somepeople.net/

.cssbtn:link{
display:inline; display:inline-block;
width:auto;
margin:0.1em; padding:2px;
background-color: #f3f3f3;
border: 1px solid #000000;
font-size: 10px;
font-family: Verdana, arial, geneva, sans-serif;
color: #000000;
text-align:center;
text-decoration: none;
vertical-align:middle;
white-space:nowrap;
cursor:hand; cursor:pointer;	
}
.cssbtn:active{
display:inline; display:inline-block;
width:auto;
margin:0.1em; padding:2px;
background-color: #f3f3f3;
border: 1px solid #000000;
font-size: 10px;
font-family: Verdana, arial, geneva, sans-serif;
color: #000000;
text-align:center;
text-decoration: none;
vertical-align:middle;
white-space:nowrap;
cursor:hand; cursor:pointer;	
}
.cssbtn:visited{
display:inline; display:inline-block;
width:auto;
margin:0.1em; padding:2px;
background-color: #f3f3f3;
border: 1px solid #000000;
font-size: 10px;
font-family: Verdana, arial, geneva, sans-serif;
color: #000000;
text-align:center;
text-decoration: none;
vertical-align:middle;
white-space:nowrap;
cursor:hand; cursor:pointer;	
}
.cssbtn:hover {
display:inline; display:inline-block;
width:auto;
margin:0.1em; padding:2px;
background-color: #000000;
border: 1px solid #000000;
font-size: 10px;
font-family: Verdana, arial, geneva, sans-serif;
color: #f3f3f3;
text-align:center;
text-decoration: none;
vertical-align:middle;
white-space:nowrap;
cursor:hand; cursor:pointer;	
}
.cssbtn[class] {
width:auto;
min-width:50px;
}

Dave

[Luzer]

Thank you

[Luzer]

got this

.cssbtn:link{
display:inline; display:inline-block;
width:auto;
margin:0.1em; padding:2px;
background-color: #f3f3f3;
border: 1px solid #000000;
font-size: 10px;
font-family: Verdana, arial, geneva, sans-serif;
color: #000000;
text-align:center;
text-decoration: none;
vertical-align:middle;
white-space:nowrap;
cursor:hand; cursor:pointer;	
}
.cssbtn:active{
display:inline; display:inline-block;
width:auto;
margin:0.1em; padding:2px;
background-color: #f3f3f3;
border: 1px solid #000000;
font-size: 10px;
font-family: Verdana, arial, geneva, sans-serif;
color: #000000;
text-align:center;
text-decoration: none;
vertical-align:middle;
white-space:nowrap;
cursor:hand; cursor:pointer;	
}
.cssbtn:visited{
display:inline; display:inline-block;
width:auto;
margin:0.1em; padding:2px;
background-color: #f3f3f3;
border: 1px solid #000000;
font-size: 10px;
font-family: Verdana, arial, geneva, sans-serif;
color: #000000;
text-align:center;
text-decoration: none;
vertical-align:middle;
white-space:nowrap;
cursor:hand; cursor:pointer;	
}
.cssbtn:hover {
display:inline; display:inline-block;
width:auto;
margin:0.1em; padding:2px;
background-color: #000000;
border: 1px solid #000000;
font-size: 10px;
font-family: Verdana, arial, geneva, sans-serif;
color: #f3f3f3;
text-align:center;
text-decoration: none;
vertical-align:middle;
white-space:nowrap;
cursor:hand; cursor:pointer;	
}

and this

<FORM method=GET action="http://www.google.com/search" target="_blank"><input type=text name=q size=20 maxlength=25 value="Search">  
        <input type=submit name=btnG value="Google">

how would i add the css to it.
puting the .cssbtn in front of it(so it loks like this

.cssbtn <FORM method=GET action="http://www.google.com/search" target="_blank"><input type=text name=q size=20 maxlength=25 value="Search">  
        <input type=submit name=btnG value="Google">

) and it did not work. im not sure how to put it together(As in have the button be css)
not to ask to much, but changing the textfield would be ?? in css?
-very TNA

[Android]

I would start by inserting class="cssbtn" inside the form tag. Or try it inside the input tag.
Alternatively, you could enclose the entire bit of code within div tags, like:

<div class="cssbtn">
<FORM method=GET action="http://www.google.com/search" target="_blank"><input type=text name=q size=20 maxlength=25 value="Search">  
        <input type=submit name=btnG value="Google"> 
</div>

For the amount of time it would take, I would try all three and see what seems to work best. (Or wait for somebody to tell you about a more correct way I've never dealt with forms, but CSS seems to work like a charm in most circumstances.)

[HTML]

The code I gave was for regular links, not submit buttons. You may want to check out Deans CSS tutorials.

Moving thread to CSS

Dave

[Luzer]

my bad in that i guess i should keep on reading. thank you for your help, all of you.