Any help is appreciated, just realised to my horror that the teyt is going haywire when I minimize the scree. This is my first page and I am very confused what I did wrong.
HTML
[SIZE=“2”][COLOR=“Black”]<html>
<head>
<title></title>
<meta http-equiv=“Content-Type” content=“text/html; charset=iso-8859-1”>
<link rel=“stylesheet” type=“text/css” href=“mycss.css” />
</head>
<body>
<div id=“header”>
<marquee>test</marquee>
<strong>BANNER/LOGO</strong>
</div>
<br/>
<br/>
<br/>
<br/>
<div id=“columnRight”>
<ul>
<li><a href="ourservice.htm" id="current">Our service</a></li>
<li><a href="personaltraining.htm">Personal Training</a></li>
<li><a href="lifestylemanagement.htm">Lifestyle Management</a></li>
<li><a href="faq.htm">FAQ</a></li>
<li><a href="price.htm">Price</a></li>
<li><a href="specialoffers.htm">Special Offers</a></li>
</ul>
</div>
<div id=“navigation”>
<a href="index.htm">Home</a>
<br/>
<a href="aboutus.htm">About us</a>
<br/>
<a href="facilities.htm">Facilities</a>
<br/>
<a href="location.htm">Location</a>
<br/>
<a href="ourtrainers.htm">Our Trainers</a>
<br/>
<a href="testimonies.htm">Testimonies</a>
</div>
<div id=“content”>
<img src=“gym1.jpg” width=“100” height=“100” />
<h1>test header</h1>
<p>main content goes here</p
<h2>test header</h2>
<p> Test Test Test Test Test Test Test Test Test Test Test Test Test TestTest Test Test TestTest Test Test Test TestTest TestTest</p>
<img src=“gym2.jpg” width=“100” height=“100” />
<h2> Test header 2</h2>
<p>Test Test Test Test Test Test Test Test Test Test Test Test Test TestTest Test Test TestTest Test Test Test Te</p>
</div>
<br/>
<br/>
<br/>
<br/>
<div id=“footer”>
<a href=“”>Contact us</a>
</div>
</body>
</html>
CSS
a:link {color: #FFFFFF; text-decoration: underline; }
a:active {color: #FFFFFF; text-decoration: underline; }
a:visited {color: #FFFFFF; text-decoration: underline; }
a:hover {color: #FFFFFF; text-decoration: none; }
#header {
background-image:url('banner.png');
padding: 10px;
height: 120px;
width:670px;
float:centre;
background-repeat:repeat-x;
text-align: center;
}
Content {
height: 100%;
width:50%;
border-color:black;
border-style:solid;
border-width:1px;
float:center;
margin: 0 auto;
padding: 10px;
}
#navigation {
float: left;
width: 200px;
height: 45%;
color: #ffffff;
background-image:url(‘gradient4.png’);
border: 1px solid #000;
padding: 5px;
}
a {
display: block;
text-decoration: none;
}
#columnRight {
float: right;
width: 200px;
height: 40%;
color: #ffffff;
background-image:url(‘gradient4.png’);
background-repeat:repeat-x;
border: 1px solid #000;
padding: 5px;
}
a {
display: block;
text-decoration: none;
}
#footer {
clear : right;
background-image: url(‘gradient4.png’);
border: 1px solid #000;
padding : 5px;
}
a {
display: block;
}
