HTML and CSS Reference
In-Depth Information
Figure 9.31
Fish Creek
contact.html
Notice how the text labels for the form controls are on the left side of the con-
tent area but are right-aligned. Create a class called labelCol that will float to
the left, has a width of 100 pixels, aligns text to the right, and has 10 pixels of
padding on the right.
Configure space around the rows of form controls. Create a class named
myRow with bottom padding set to 20 pixels.
Configure extra space surrounding the submit button by creating a class called
mySubmit with a left margin set to 110 pixels and all other margins set to 10
pixels.
Save the fishcreek.css file.
2. The Contact Page. Use the Ask the Vet page as the starting point for Contact page.
Launch Notepad and open the askvet.html file in the fishcreekcss folder that you
previously created. Save the file as contact.html. Modify your file to look similar
to the Contact page, as shown in Figure 9.31, as follows:
Change the page title to an appropriate phrase.
The Contact page will contain an <h2> element and a form in the rightcolumn
div . Delete the Ask the Vet page content from the rightcolumn div (but
leave the page footer in place).
Add an <h2> element that contains the following text: Contact FishCreek
Prepare to code the XHTML for the form area. Begin with a <form> tag that
uses the post method and the action attribute to invoke server-side process-
ing. Unless directed otherwise by your instructor, configure the action attrib-
ute to send the form data to http://webdevfoundations.net/scripts/fishcreek.asp.
Configure the form control for the Name information. Code a <div> that is
assigned to the myRow class. Create a <label> element that is assigned to the
labelCol class. Code the text, Name: . Create a text box named myName .
Search WWH ::




Custom Search