Without CSS
Without CSS
Without CSS
CSS:
Code:
HTML:
<!doctype html>
<html>
<head>
<title>Jake's Cofee Shop</title>
<link rel="stylesheet" type="text/css" href="file:///C:/Users/Nitin/Documents/IWP/jake2.css">
</head>
<body>
<div id="container">
<div id="box">
<div id="top" align="center"><strong><h1>Jake's Cofee Shop</h1></strong></div>
<br>
<br>
<div id="nav" align="left">
<ul class="na">
<li><a href='#'>Home</a></li>
<li><a href='#'>Menu</a></li>
<li><a href='#'>Music</a></li>
<li><a href='#'>Jobs</a></li>
</ul>
</div>
<br>
<br>
<div id="image">
<img src="http://www.todayifoundout.com/wp-content/uploads/2015/07/coffee2.png"
width="200" height="200"></div>
<div id="content">
Come in and experience...<br>
<ul >
<li>Specialty Cofee and Tea</li>
<li>Freshlmy made sandwiches</li>
<li>Bagels, Muffins and ORganic Snacks</li>
<li>Music and Poetry Readings</li>
<li>Open mic nights</li>
<li>...</li></ul>
<footer>
23 Pine Road<br>
Nottingham, NG1 5YU<br>
0115 9324567<br>
</footer>
</div>
<br>
<div align="center" id="bottom"><i>
Copyright © 2011 Jake's Coffee House<br>
<a href='#'>jake@jcoffee.com</a></i><br>
</div>
</div>
</div>
</body>
</html>
CSS:
body
{
background-color: #ffffcc;
font-family: verdana;
}
#container
{
margin: auto;
}
#box
{
border: 3px solid black;
height: 390px;
width: 1000px;
margin-left: 280px;
margin-top: 130px;
}
#top
{
border:2px solid black;
background-color:#ccaa66;
color:#330000;
}
#bottom
{
border:2px solid black;
background-color:#ccaa66;
color:#330000;
padding-top:2px;
padding-bottom:2px;
}
#nav
{
background-color:#E8D882;
width:160px;
position: fixed;
height: 262px;
margin-top: -39px;
margin-left: 0.2px
}
a
{
text-decoration: none;
}
.na
{
list-style-type:none;
padding: 2px;
}
ul.na > li
{
padding: 10px;
}
#image
{
float: right;
margin-top: -28px;
margin-right: 10px;
}
#content
{
margin-left: 201px;
margin-top: -59px;
}