I am looking for the solution to Case Study on page 292 (JavaJam CSS two-column)
ID: 3927426 • Letter: I
Question
I am looking for the solution to Case Study on page 292 (JavaJam CSS two-column) "Web Development and Design Foundations with HTML5 8th edition". Does anyone have this? I need to check a few things on it. Thank you. I am not sure what that means.. the text book is: Web Development and Design Foundations with HTML5 8th edition: ISBN-13: 978-0134322759 I am looking for the case study from Web Development and Design Foundations with HTML5 8th edition: ISBN-13: 978-0134322759 in chapter 6 on page 292- "Website case study" Implementing a CSS Two-Column Page" for the JavaJam Coffee House. Pages 292-296. Does that help? Thank you.
before submitting this question it was forcing me to select a subject.. html is not in the subject list.....
Explanation / Answer
Answer:
Program Code:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>JavaJam Coffee House</title>
<link rel="stylesheet" type="text/css" href="javajam.css">
<meta charset="utf-8">
</head>
<body id="wrapper">
<div id="wrapper">
<header>
<div><h1><div><img class="logoImg" src="javajam/mugs.jpg" alt ="mugs" height="65" width ="65" align = "left"></div> JavaJam Coffee House</h1></div>
</header>
<br>
<nav>
<a href="index.html">Home</a> <a href="menu.html">Menu</a>
<a href="music.html">Music</a> <a href="jobs.html">Jobs</a>
</nav>
<br>
<main>
<img class="logoImg" src="javajam/windingroad.jpg" alt ="windingroad" height="60%" width ="50%" align = "right">
<h2>Follow the Winding Road to JavaJam</h2>
<p>We're a little out of the way, but take a drive down Route 42 to <br> JavaJam today!
Indulge in our locally roasted free-trade coffee <br> and home-made pastries. You'll feel right at home at JavaJam!<br>
</p>
<h3>JavaJam Coffee House features: </h3>
<ul>
<li>Speciality Coffee and Tea</li>
<li>Bagels, Muffins and Organic Snacks</li>
<li>Music and Poetry Readings</li>
<li>Open Mic Night Every Friday</li>
</ul>
<div>
<p>
54321 Route 42 <br> Ellison Bay, WI 54210<br> 888-555-5555
</p>
</div>
</main>
<footer>
Copyright 2016 JavaJam Coffee House<br> <a href="">yourfirstname@yourlastname.com</a>
</footer>
</div>
</body>
</html>
music.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>JavaJam Coffee House</title>
<link rel="stylesheet" type="text/css" href="javajam.css">
<meta charset="utf-8">
</head>
<body>
<div id="wrapper">
<header>
<h1>JavaJam Coffee House</h1>
</header>
<br>
<nav>
<a href="index.html">Home</a> <a href="menu.html">Menu</a>
<a href="music.html">Music</a> <a href="jobs.html">Jobs</a>
</nav>
<br>
<div>
<h2>Coffee at Java Jam</h2>
<dt><strong>Just Java</strong></dt>
<dd>
Regular house blend, decaffeinated coffee, or flavor of the day.<br>
Endless Cup $2.00
</dd>
<dt><strong>Cafe au Lait</strong></dt>
<dd>
House blended coffee infused into a smooth, steamed milk.<br>
Single $2.00 Double $3.00
</dd>
<dt><strong>Iced Cappuccino</strong></dt>
<dd>
Sweetened espresso blended with icy-cold milk and served in a
chilled glass. <br> single $4.75 Double $5.75
</dd>
</div>
<br>
<footer>
Copyright 2016 JavaJam Coffee House<br> <a href="">yourfirstname@yourlastname.com</a>
</footer>
</div>
</body>
</html>
javajam.css
@CHARSET "ISO-8859-1";
header
{
background-color: #D2B48C;
text-align: center;
width: 900x;
}
h1 {
background-color: #D2B48C;
/* margin: 0px 0px 0px 10px; */
font-size: 50;
font-weight: bold;
line-height: 100%;
}
body {
width: 850x;
height: 500px;
background-color: #FCEBB6;
color: #221811;
font-family: Verdana, Arial, sans-serif;
margin: 40px 10px 10px 40px;
}
p {
font-family: Times New Roman;
font-size: 22px;
}
#wrapper {
/*background-color: #b3c7e6;
color: #000066;*/
width: 80%;
/*height: 200%;*/
margin-right: auto;
margin-left: auto;
}
nav {
text-align: center;
font-weight: bold;
width: 650px;
height: 5%;
/*margin: 40px 10px 10px 40px;*/
}
footer {
background-color: #D2B48C;
font-style: italic;
text-align: center;
font-size: .60em;
}
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.