CSS and forms

@DanDigiManJan 14.2004

Just wondering how people in here code their forms using XHTML and CSS? More precisely, how they position the different labels to their form elements? What about 2 to 3 column forms? I’m thinking it might be a daunting task programming forms with alot of form fields in them…

to post a comment

CSS

@fredmvJan 14.2004 — #I'd suggest reading through [url=http://www.codingforums.com/showthread.php?s=&threadid=30718]this thread[/url]. ?

@Robert_WellockJan 14.2004 — #The web is small since I know some of the members there from other forums.

I'd use <label> and <legend> in general.

@FangJan 14.2004 — #I have designed 4 column forms with css and with tables in xhtml.

Which is correct? Both in my view.

There is too much hype about the misuse of tables:

You can change an element into another <div style="display:table;"></div> a table or a div?

Or wil [URL=http://www.w3.org/TR/css3-multicol/]css3[/URL] be the answer with the advent of columns (aka tables)?

@DanDigiManauthorJan 14.2004 — #Thanks for the info. I've been tinkering all afternoon with this and I can't seem to access anything thru CSS...

[CODE]
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
 <html>
 <head>
 <title>Untitled</title>
 <style type="css">
 /*First form*/
 test#personal_information{
 background-color: blue;
 width: 300px;
 }
 #personal_information{
 font-family: arial;
 font-size: 80%;
 }
 form#test label{
 font-family: arial;
 }
 /*second form*/
 form#test2 label{
 background-color: blue;
 font-family: arial;
 }
 </style>
 </head>
 
 <body>
 <form id="test" action="file.cfm" method="post">
 <fieldset id="personal_information">
 <legend>Personal Information</legend>
 <label for="fname">First Name: <input name="fname" id="fname" type="text"/></label>
 <label for="lname">Last Name: <input name="lname" id="lname" type="text"/></label>
 <label for="address">Address: <input name="address" id="address" type="text"/></label>
 <input type="submit"/>
 </fieldset>
 </form>
 <br/>
 <form id="test2" action="file2.cfm" method="post">
 <label for="bname">Bank Name: <input name="bname" id="bname" type="text"/></label>
 <input type="submit"/>
 </form>
 </body>
 </html>
 [/CODE]

@DanDigiManauthorJan 14.2004 — #Got it... it seems its supposed to be "text/css" as the type of style...

ie. <style type="css"> -> <style type="text/css">

:mad: ?

CSS and forms

5 Comments(s) _↴

Also in #CSS _↴

Success!

Social

Version

CSS and forms

5 Comments(s) ↴

Also in #CSS ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

5 Comments(s) _↴

Also in #CSS _↴