Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialAlexander Stratev
15,731 PointsHTML CODE
Could anyone post the html code from this video please? I accidentally deleted it. Thank you!
2 Answers
Matt Coale
Full Stack JavaScript Techdegree Graduate 17,884 PointsHere is the completed code I ended up with. Hope it helps.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Tacos By Roscoe is not a real restaurant, as far as I know. This is a demo by Anwar Montasir for a Team Treehouse lesson on accessible forms.">
<title>Tacos By Roscoe | Delivery Information</title>
<link href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,400;0,900;1,400;1,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
<link rel="stylesheet" href="style.css">
<!-- add FontAwesome here -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" integrity="sha384-vp86vTRFVJgpjF9jiIGPEEqYqlDwgyBgEF109VFjmqGmIY/Y4HV4d3Gp2irVfcrp" crossorigin="anonymous">
</head>
<body>
<header>
<div id="logo">
<div class="container">
<img src="images/taco-emoji.png" alt="Tacos By Roscoe taco emoji logo" id="logo-img">
<span id="logo-text">Tacos By Roscoe</span>
</div>
</div>
<nav class="container">
<ul class="nav-flex">
<li><a href="index.html">Delivery</a></li>
<li><a>Billing</a></li>
<li><a>Review</a></li>
</ul>
</nav>
</header>
<main>
<div class="container">
<div id="summary">
<i class="fas fa-utensils fa-3x"></i>
<div id="summary-text">
<p>Delivery by 7pm, April 13, 2020</p>
<p>6 items, <span class="check"></span> $31.44</p>
</div>
</div>
<form>
<fieldset>
<legend>Delivery Information</legend>
<p class="hint">* - required field</p>
<label for="name">Your Name * </label>
<input type="text" id="name" name="user-name">
<label for="email" class="error-text">Email Address * <i class="fas fa-exclamation-triangle"></i></label>
<input type="email" id="email" name="user-email" class="error-input">
<p class="hint error-text">Email address must contain a single @.</p>
<label for="address1">Street Address *</label>
<input type="text" id="address1" name="user-address1">
<label for="address2">Apartment/Office Number</label>
<input type="text" id="address2" name="user-address2">
<label for="zip" class="error-text">Zip Code * <i class="fas fa-exclamation-triangle"></i></label>
<input type="text" id="zip" name="user-zip" class="error-input">
<p class="hint error-text">Please enter a Zip Code.</p>
<label for="phone">Phone</label>
<input type="tel" id="phone" name="user-phone" value="">
<p class="hint">No phone? Include alternate contact below.</p>
<label for="delivery-instructions">Delivery Instructions</label>
<textarea id="delivery-instructions" name="user-delivery-instructions"></textarea>
<button type="submit">Continue to Billing</button>
</fieldset>
</form>
</div>
</main>
</body>
</html>
Wesley Gray
4,593 PointsJust a heads up, be careful how you enter the word "code". There is an element by that name.
Nicholas Prober
4,925 PointsHow does this report an error? This is just a made up class name with a solid red border + text.
Wesley Gray
4,593 PointsAre you not seeing the warning arrow? If not, make sure that you have the Font Awesome link in your code.
<script src="https://kit.fontawesome.com/37f56f6cf5.js" crossorigin="anonymous"></script>
Stefan Dobrincu
5,947 PointsStefan Dobrincu
5,947 PointsHey, you can launch a new workspace with the same results or you can download the files from the notes of the video and paste it back in your workspace.