Hi,
Adding text to images is a very time consuming process. It's also difficult to read text on top of graphics.
Below is what I sort of meant. This is obviously not a completed design, but I figure a picture is worth a thousand words.. just cut and paste.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sans Moi contemporary Jazz band</title>
<style type="text/css">
<!--
body,td,th {
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
}
body {
background-image: url(images/2006-05_Mindbender_033!.jpg);
background-repeat: no-repeat;
}
#wrapper {
width:960px;
margin:12px auto;
background:#561F0C;
border:#4F0000 solid;
}
#header {
text-align:right;
}
#nav {
background:#4F0000;
text-align:center;
height:20px;
}
#navbar {
list-style:none;
}
#navbar ul {
display:inline;
}
#navbar li {
float:left;
width:150px;
}
#navbar li a {
color:#FFFFFF;
font-size:16px;
text-decoration:none;
}
#content {
}
h1 {
color:#FFFFFF;
font-size:24px;
}
h2 {
color:#FFFFFF;
font-size:18px;
font-style:italic;
}
.body_text {
color:#FFFFFF;
margin-left:20px;
}
-->
</style></head>
<body>
<div id="wrapper">
<div id="header">
<h1>Sans Moi Contemporary Jazz band</h1>
<h2>Sans Moi is French for "without me" or "without ego".</h2>
</div>
<div id="nav">
<!-- need to modify hyperlinks below -->
<ul id="navbar">
<li><a href="index.htm">About Us</a></li>
<li><a href="index.htm">Photo Gallery</a></li>
<li><a href="index.htm">Calendar</a></li>
<li><a href="index.htm">Discography</a></li>
<li><a href="index.htm">Chat me up</a></li>
<li><a href="index.htm">Links</a></li>
</ul>
</div>
<div id="content">
<br /><br /><br /><br /><br /><br />
<p class="body_text">Big thanks to Warren's Jazz Bistro June 16th for letting us entertain there and a Big thanks to all of you who filled the tables!</p>
<p class="body_text">Insert more text here....</p>
<br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br />
</div>
</div>
</body>
</html>
Linear Mode
