I have taken a basic page template that was originally designed for the rest of my website and customized it to appear more simplistic. The page now consists of an unordered list with a brief paragraph at the top and a logo aligned to the right. While everything looks fine in the system preview, once uploaded to the server, all the CSS styling is lost.
Here is the HTML code:
#title {
width:400px;
position:fixed;
}
#icon {
position:relative;
float:right;
}
h5 {
font-size:25px;
color:#ff6682;
line-height:1.35em;
}
a:link {
color:#253b84;
}
<!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>/other</title>
<link href="assets/scripts/AMK_Website.css" rel="stylesheet"
type="text/css" />
</head>
<body>
<div id="icon">
<img src="assets/images/icon/icon.gif" width="80" height="106" alt=""/>
</div>
<div id="title">
<h5> /other is a collection of personal work in design photography, as
well as work that inspires me. To get back to
the important stuff, <a href="index.html">click here</a>
</h5>
</div>
<div id="photolist">
<ul>
<li><img src="assets/images/other/1.jpg" width="768" height="1024"
alt=""/></li>
</ul>
</div>
</body>
</html>
Any assistance would be greatly appreciated!