Creating HTML and CSS Markup - Realtime Web Apps: With HTML5 WebSocket, PHP, and jQuery - page 117

Next, use that same format to generate the “create a room” form, which is nearly the same markup-wise. Add this
<form> element directly after the previous “attending” form element we just added:
<form id="presenting">
<h2>Presenting?</h2>
<p>Create a room to start your Q&amp;A session.</p>
<label>
Tell us your name (so attendees know who you are).
<input type="text" name="presenter-name" />
</label>
<label>
Tell us your email (so attendees can get in touch with you).
<input type="email" name="presenter-email" />
</label>
<label>
What is your session called?
<input type="text" name="session-name" />
</label>
<input type="submit" value="Create Your Room" />
</form><!--/#presenting-->
There is nothing remarkable about this code, with the exception of the use of type="email" for the presenter e-mail
input. Save it and reload the browser; you now have both forms for the home view, albeit unstyled (see Figure 7-8 ).
Figure 7-8. All the markup for the home view is in place, but it needs styling