I've got this working nicely in Firefox, IE5 and IE6 except that in IE6 the last 2 characters in the body text (in this case the s. from the word mauris.) is being duplicated and appears flush to the left after the end of the content and before the footer (see attached screenshot). I've tried varying the amount of copy but it doesn't seem to make a difference.
Any ideas what would cause that last 2 characters to be duplicated?
stylesheet
----------
body {
margin: 0;
margin-top: 15px;
margin-bottom: 10px;
padding: 0;
background: url('images/background.jpg') repeat-y;
color: #000;
text-align: center;
font: small Arial, Helvetica, sans-serif;
}
#container {
margin: 0px auto;
margin-bottom: 15px;
text-align: left;
width: 780px;
w\idth: 780px;
}
/* h6 used for banner image */
h6 {
margin: 0;
padding: 0;
color: #3a88c8;
font: small Arial, Helvetica, sans-serif;
}
h6 img {
border: 0;
padding: 0;
margin: 0;
}
h6 a, h6 a:visited {
color: #3a88c8;
font: small Arial, Helvetica, sans-serif;
}
#bluebar {
margin: 0;
padding: 0;
color: #3a88c8;
background: #fff;
text-align: center;
line-height: 25px;
font-variant: small-caps;
font-weight: bold;
border-bottom: 2px solid #3a88c8;
}
h4 {
font-size: 12px;
font-weight: bold;
}
#left {
width: 165px;
float: left;
}
#navcontainer {
width: 165px;
w\idth: 165px;
margin: 0;
margin-bottom: 20px;
padding: 0;
padding: 10px 0 20px 0;
background: #3a88c8;
}
#navcontainer ul {
margin: 0;
padding: 0;
list-style-type: none;
font: 13px Arial, Helvetica, sans-serif;
text-indent: 10px;
}
#navcontainer a {
display: block;
width: 165px;
w\idth: 165px;
height: 22px;
}
#navcontainer a:link, #navcontainer a:visited {
color: #fff;
text-decoration: none;
}
#navcontainer a:hover {
color: #ccc;
text-decoration: none;
}
#nav, #nav ul {
padding: 0;
margin: 0;
list-style: none;
float : left;
width : 165px;
w\idth: 165px;
background: #3a88c8;
}
#nav li { /* all list items */
position : relative;
float : left;
line-height : 22px;
width: 165px;
w\idth: 165px;
}
#nav li a {
width: 165px;
w\idth : 165px;
display : block;
padding : 0;
}
#nav li a:hover {
color : #ccc;
}
#tag {
color: #fff;
font-size: 18px;
margin: 20px;
}
#content {
position: absolute;
margin: 0;
width: 780px;
w\idth: 780px;
float: left;
text-align: left;
background: #ebf2f8;
}
#right {
width: 615px;
w\idth: 555px;
padding: 30px;
float: left;
text-align: left;
}
#pageheader {
color: #3a88c8;
font: large Arial, Helvetica, sans-serif;
}
#footer, #wsb {
font-size: x-small;
padding: 0;
margin: 0;
margin-top: 2px;
text-align: center;
clear: both;
}
#footer {
color: #000;
}
#footer a, #footer a:visited {
color: #000;
}
#footer a:hover {
color: #000;
}
#wsb {
color: #aaa;
}
#wsb a, #wsb a:visited {
color: #aaa;
}
#wsb a:hover {
color: #3a88c8;
}
html
----
<body>
<div id="container"><h6><a href="index.php"><img src="images/banner.jpg" alt="AVOW" border="0" width="780" height="199" /></a></h6>
<div id="bluebar">
Ancient Healing + High Technology = Stress Reduction
</div>
<div id="content">
<!-- Begin LEFT -->
<div id="left">
<!-- Begin navigation -->
<div id="navcontainer">
<div id="nav">
<ul>
<li><a href="">:: Locations & Services</a></li>
<li><a href="">:: Programs & Gift Ideas</a></li>
<li><a href="">:: Events</a></li>
<li><a href="">:: Client Stories</a></li>
<li><a href="">:: Home</a></li>
</ul>
</div>
<div id="tag"><p>See what you can achieve</p></div>
</div>
<!-- End navigation -->
</div>
<!-- End LEFT -->
<!-- Begin Main Content/RIGHT -->
<div id="right">
<div id="pageheader">Locations & Services</div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin tincidunt. Vestibulum vestibulum nulla sodales augue. Aliquam in mi a erat luctus consectetuer. Aenean turpis dui, dignissim et, tempor quis, aliquet a, mauris. Etiam purus lorem, nonummy ac, mollis nec, tincidunt nec, turpis. Donec lacus orci, vehicula ut, malesuada at, vestibulum ut, erat. Aliquam luctus lectus id ipsum. Sed et purus. Donec mollis.</p>
<p>Duis dui leo, nonummy ut, aliquam at, ornare eget, lectus. Ut nisl. Mauris lorem. Duis luctus, pede vitae commodo varius, urna augue luctus sem, ac faucibus libero justo sit amet odio. Fusce ut nibh. Sed wisi orci, cursus a, consequat sit amet, pharetra a, purus. Donec rutrum pulvinar leo. Donec in libero. Sed id urna quis nibh vehicula porta. Vestibulum porta nunc at massa.</p>
<p>Nunc et orci. Ut condimentum massa non enim. Quisque sed lacus a odio consequat faucibus. In lacus quam, gravida et, dignissim at, lacinia sit amet, nibh. Nulla a lectus vitae neque vestibulum laoreet. Phasellus quis lorem eu ante aliquet semper. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mauris.</p>
</div>
<!-- End Main Content/RIGHT -->
<!-- Begin Footer -->
<div id="footer">Copyright © 2004 A Vision Of Wellness</div>
<!-- End Footer -->
</div>
</div>
</body>
Bookmarks