Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Professional looking forms

Status
Not open for further replies.
LaPluma

LaPluma

Programmer
Feb 3, 2002
139
DE
Hello

Sometimes when surfing the Internet I come across really sleek-looking professional forms. For instance, the visitor types his name, subject and e.mail address into what are, apparently, blanks spaces surrounded by, say, a crisp blue border. There is no sign of the "input name", type of 3D box which visitors usually type their name, subject, and e.mail details into.

How can that be achieved? I imagine there must still be an "input name" type of box, but is this hidden?

Thanks for any advice.
 
Sort by date Sort by votes
Hi mate,

<HTML>
<HEAD>
<TITLE>Test</TITLE>
<style>
.searchbox {
border:solid 1 #336699;
font-family: verdana,arial,helvetica;
font-size: 8pt;
background-color: #EFAD92;
COLOR: #336699;
font-weight: bold;
}
</style>
</HEAD>
<BODY BGCOLOR=&quot;#EFAD92&quot;>
<form>
<input type=&quot;text&quot; class=&quot;searchbox&quot;>
</form>
</BODY>
</HTML>

Hope this helps Wullie

sales@freshlookdesign.co.uk

 
Upvote 0 Downvote
No, I haven't got any URLs in mind - wish I had - but I can picture the type of forms I mean.

Name: Simple rectangular blue bordered box here (not 3-D).

Subject:Simple rectangular blue bordered box here (not 3-D).

etc

Maybe I have seen it in Java?
 
Upvote 0 Downvote
wullie provided a example of using cascading style sheet or CSS to change the formatting of the text field.
wullie, if you don't mind the disection
the style tags go into the head section of your HTML page.
although you can use inline but go to that after you get the hang of this.
explanations
<style>
.searchbox {
//this is how you place the formatting into the field you want. hence the class=&quot;searchbox&quot;

border:solid 1 #336699;
//this sets the border style

font-family: verdana,arial,helvetica;
font-size: 8pt;
//font styles

background-color: #EFAD92;
//the color of the background to the box

COLOR: #336699;
font-weight: bold;
}
</style>

as before calling this style to the box is a matter of the class attribute as in
<input type=&quot;text&quot; class=&quot;searchbox&quot;>

hope that explains a little for you.
[bomb]
I may not get it the 1st or 2nd time,
but how sweet that 15th time can be.
admin@onpntwebdesigns.com
 
Upvote 0 Downvote
Hi all,

I know how to do the part for input fields. But the problem I've been having is on combo boxes and drop downs. What do I have to put to make them look like my input fields?

thanks,

gecko2 ;)
 
Upvote 0 Downvote
I dont think you can. I have tried a few times and it never worked! You should be able to change the colours etc but not the border props, as far as I know!


É

endamcg-logo1b.gif

 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

SteveL714
  • Locked
  • Question
Looking for HTML5 'Read More' tool
Replies
5
Views
157
SteveL714
SteveL714
bgreen39
  • Locked
  • Question
Creating Web Site Forms
Replies
7
Views
145
HigherHigher
HigherHigher
qtluvsjc
  • Locked
  • Question
Forms: Dropdown box alters next dropdown box
Replies
2
Views
74
vacunita
vacunita
normm
  • Locked
  • Question
css forms within td margin / padding problem 1
Replies
3
Views
73
normm
normm
Kirsle
  • Locked
  • Question
HTML 4.01, Forms, and &lt;/p&gt; 1
Replies
2
Views
126
Kirsle
Kirsle

Part and Inventory Search

Sponsor

Back
Top