XHTML/CSS Forms

	Home Register Search Help Login

Sponsors

Shopping Cart Software
Ecommerce software integrated into Frontpage, Dreamweaver and Golive templates. No monthly fees and available in ASP and PHP versions.

Website Templates
We also have a wide selection of Dreamweaver, Expression Web and Frontpage templates as well as webmaster tools and CSS layouts.

Frontpage website templates
Creative Website Templates for FrontPage, Dreamweaver, Flash, SwishMax

Search Forums

Recent Posts

Todays Posts
Most Active posts
Posts since last visit
My Recent Posts
Mark posts read

XHTML/CSS Forms

View related threads: (in this forum | in all forums)

Logged in as: Guest

Users viewing this topic: none

Printable Version

All Forums >> Web Development >> Cascading Style Sheets >> XHTML/CSS Forms

Page: [1]


BobbyDouglas Posts: 5440 Joined: 5/15/2003 From: Arizona Status: offline	XHTML/CSS Forms - 10/7/2004 12:11:56 Anyone have good examples of forms made in xhtml/css? _____________________________ Arizona Web Design - Mr Bobs Web Design in Arizona The Arizona Web Hosting Challenge


bobby Posts: 11394 Joined: 8/15/1969 From: Seattle WA USA Status: offline	RE: XHTML/CSS Forms - 10/7/2004 12:22:29 not personally... but a google search brought up quite a few... heres one from the list: http://webdesign.about.com/cs/websitetemplates/p/blformlayout.htm _____________________________ If con is the opposite of pro, is Congress the opposite of progress? (in reply to BobbyDouglas)


BobbyDouglas Posts: 5440 Joined: 5/15/2003 From: Arizona Status: offline	RE: XHTML/CSS Forms - 10/7/2004 12:24:37 I searched on Google and didn't quite get good results. I would think XHTML / CSS Form would bring up some good pages. Google is slipping. Time for class now, but hopefully others will have some more examples when I get back. Thanks Bobby. _____________________________ Arizona Web Design - Mr Bobs Web Design in Arizona The Arizona Web Hosting Challenge (in reply to bobby)


Giomanach Posts: 6086 Joined: 11/19/2003 From: England Status: offline	RE: XHTML/CSS Forms - 10/7/2004 15:14:22 You really don't need to search for this Bobby.... Just make sure you apply CSS to the following HTML elements: input select textarea radio checkbox Or apply classes to each of them....Then you can code the form in XHTML as you would normally... http://giomanach.wm-talk.com/misc/webs/iog-new/contact.php - the form there is XHTML formatted with CSS... (PHP generated) HTH < Message edited by Giomanach -- 10/7/2004 15:29:36 > _____________________________ (in reply to BobbyDouglas)


BobbyDouglas Posts: 5440 Joined: 5/15/2003 From: Arizona Status: offline	RE: XHTML/CSS Forms - 10/7/2004 15:56:50 The formatting for the link you posted is a very simple form. I was going to do something rather complex. I figured a table would need to be used for what I want to do, but hoped there would be some online examples of what others accomplished. _____________________________ Arizona Web Design - Mr Bobs Web Design in Arizona The Arizona Web Hosting Challenge (in reply to Giomanach)


Giomanach Posts: 6086 Joined: 11/19/2003 From: England Status: offline	RE: XHTML/CSS Forms - 10/7/2004 16:19:55 Simple or complex...the CSS implentation process is the same. _____________________________ (in reply to BobbyDouglas)


d a v e Posts: 4029 Joined: 7/24/2002 From: England (but live in Finland now) Status: offline	RE: XHTML/CSS Forms - 10/7/2004 16:20:18 there's a snippet here http://www.alistapart.com/articles/practicalcss/ scroll down a wee bit... there might be something on eric meyers site _____________________________ David Prescott Gekko web design (in reply to BobbyDouglas)


c1sissy Posts: 5084 Joined: 7/20/2002 From: NJ Status: offline	RE: XHTML/CSS Forms - 10/8/2004 9:03:35 http://academ.hvcc.edu/~kantopet/xhtml/index.php?page=xhtml+forms http://www.picment.com/articles/css/funwithforms/ The above link comes from a site called the css vault. This is an excellent site and has TONS of information on it. I highly suggest a walk through their material. http://webdesign.about.com/library/layouts/zformlayout.htm Not sure if these will help you out or not, but they have some pretty great information on them. And keep the CSSvalut bookmarked, there is a ton of information in there to read. _____________________________ Deb-aka-c4Ksissy high panjandurum and alpha female of the silverback tribe As decreed by Jesper 5-24-2003. The only stupid question is... the one that is never asked!! http://directory.css-styling.com http://fmsforum.com http://positioniseverything.net/ http://www.tanfa.co.uk/ (in reply to d a v e)


BobbyDouglas Posts: 5440 Joined: 5/15/2003 From: Arizona Status: offline	RE: XHTML/CSS Forms - 10/8/2004 10:05:30 All these links help so far. I guess instead of using tables/cells you can just use <p>'s for everything- or so it seems. Thanks for the help! _____________________________ Arizona Web Design - Mr Bobs Web Design in Arizona The Arizona Web Hosting Challenge (in reply to c1sissy)


caz Posts: 3486 Joined: 10/10/2001 From: Somewhere south of Chester, UK Status: offline	RE: XHTML/CSS Forms - 10/8/2004 12:26:23 The source of all knowledge W3C Real life:- NN4 problems: http://www.mako4css.com/cssforms.htm sample which doesn't work in IE5:- http://www.quirksmode.org/css/forms.html other examples:- http://realworldstyle.com/forms.html http://www.dutchcelt.nl/blogged/204_0_1_5_C/ tutorial:- http://www.designplace.org/tutorials.php?page=1&cid=9 http://www.sitepoint.com/article/style-web-forms-css discussions elsewhere:- http://www.webmasterworld.com/forum83/3758.htm http://www.webmasterworld.com/forum83/222.htm And our own Katherine Nolan has a tutorial on styling forms with CSS Here I don't think that I have duplicated any of the links given by others, but I would really suggest that you start with the ALA reference given by Dave. Cheers Carol PS. Give Teoma a try sometime < Message edited by caz -- 10/8/2004 12:33:19 > _____________________________ Do not meddle in the affairs of cats, for they are subtle and will dance, or more on your keyboard. Cheshire cat. www.doracat.co.uk I remember when it took less than 4hrs to fly across the Atlantic. (in reply to BobbyDouglas)


c1sissy Posts: 5084 Joined: 7/20/2002 From: NJ Status: offline	RE: XHTML/CSS Forms - 10/8/2004 18:14:03 thanks for the links Carol, they are all pretty good ones. _____________________________ Deb-aka-c4Ksissy high panjandurum and alpha female of the silverback tribe As decreed by Jesper 5-24-2003. The only stupid question is... the one that is never asked!! http://directory.css-styling.com http://fmsforum.com http://positioniseverything.net/ http://www.tanfa.co.uk/ (in reply to caz)

BobbyDouglas

Posts: 5440
Joined: 5/15/2003
From: Arizona
Status: offline

RE: XHTML/CSS Forms - 10/11/2004 1:45:40

Here is what I am working with right now, however I would like to have three columns to place information in. Maybe someone has a suggestion for this.

CODE

<html>

<head>
	<title></title>
<style>
div#titlenav { 
    background-color:#EFF4F8;
    text-align:left;
    margin-top:0px;
    padding:5px;
    border:1px solid #375A8B;
}
    </style>
</head>

<body>
<div id="titlenav">		
<p>City:</p>
<p><input type="text" name="City" size="20"></left></p>
<p>Square Footage:</p>
<p><select size="1" name="SquareFootage">
<option selected>Any Square Footage</option>
<option>1+</option>
<option>2+</option>
<option>3+</option>
<option>4+</option>
<option>5+</option>
<option>Studio/Lot</option>
</select></left></p>
<p># of Beds:</p>
<p><select size="1" name="Beds">
<option selected>Any Number</option>
<option>1+</option>
<option>2+</option>
<option>3+</option>
<option>4+</option>
<option>5+</option>
<option>Studio/Lot</option>
</select></left></p>
<p>Price:</p>
<p><left> <select size="1" name="Price1">
<option>$0.00</option>
<option>$25,000</option>
<option>$50,000</option>
<option>$75,000</option>
<option>$100,000</option>
<option>$125,000</option>
<option>$150,000</option>
<option>$175,000</option>
</select> to: <select size="1" name="Price1">
<option>$0.00</option>
<option>$25,000</option>
<option>$50,000</option>
<option>$75,000</option>
<option>$100,000</option>
<option>$125,000</option>
<option>$150,000</option>
<option>$175,000</option>
</select></p>
</div>

</body>

</html>

_____________________________

Arizona Web Design - Mr Bobs Web Design in Arizona
The Arizona Web Hosting Challenge

(in reply to c1sissy)

Giomanach

Posts: 6086
Joined: 11/19/2003
From: England
Status: offline

RE: XHTML/CSS Forms - 10/13/2004 0:15:15

Try something like this:

<html>

<head>
	<title></title>
<style>
div#titlenav { 
    background-color:#EFF4F8;
    text-align:left;
    margin-top:0px;
    padding:5px;
    border:1px solid #375A8B;
}

p{
	display: inline;
	}

p.column{
	padding-right: 50px;
}
    </style>
</head>
<body>
<div id="titlenav">		
<p>City:</p>
<p class="column"><input type="text" name="City" size="20"></left></p>
<p>Square Footage:</p>
<p class="column"><select size="1" name="SquareFootage">
<option selected>Any Square Footage</option>
<option>1+</option>
<option>2+</option>
<option>3+</option>
<option>4+</option>
<option>5+</option>
<option>Studio/Lot</option>
</select></left></p>
<p># of Beds:</p>
<p class="column"><select size="1" name="Beds">
<option selected>Any Number</option>
<option>1+</option>
<option>2+</option>
<option>3+</option>
<option>4+</option>
<option>5+</option>
<option>Studio/Lot</option>
</select></left></p>
<br><br>
<p>Price:</p>
<p class="column"><select size="1" name="Price1">
<option>$0.00</option>
<option>$25,000</option>
<option>$50,000</option>
<option>$75,000</option>
<option>$100,000</option>
<option>$125,000</option>
<option>$150,000</option>
<option>$175,000</option>
</select> to: <select size="1" name="Price1">
<option>$0.00</option>
<option>$25,000</option>
<option>$50,000</option>
<option>$75,000</option>
<option>$100,000</option>
<option>$125,000</option>
<option>$150,000</option>
<option>$175,000</option>
</select></p>
</div>
</body>
</html>

_____________________________

(in reply to BobbyDouglas)