As some of you may or maynot know ive been developing a site now i have it running perfectly in FF and have tested in IE and seemed to be running fine untill i put it online. then i got strange and weird things happening in IE (NOTE: Under Windows 7's new version of IE it seems to be fixed but as not many people are going to be using this new version of IE as yet it needs to be fixed for the older versions of the browser). Here is a link to the site so you can see what i mean:
Totally Fun Amusements AustraliaHere is the CSS code as you can view the HTML by viewing the source of the pages:
Code:
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/
body {
margin: 0;
padding: 0;
background: #0F5B96 url(../images/img01.gif) repeat-x;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #A4E4F5;
}
input, textarea {
background: #A4E4F5;
border: 1px solid #FFFFFF;
font: bold 13px Arial, Helvetica, sans-serif;
color: #0F5B96;
}
/*h1, h2, h3, p, ol, ul {
margin-top: 0;
}*/
h1, h2, h3 {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
h1, h2 {
text-transform: lowercase;
font-weight: normal;
}
h1 {
letter-spacing: -2px;
font-size: 2.4em;
}
h2 {
letter-spacing: -1px;
font-size: 1.8em;
}
p, ol, ul {
margin-bottom: 1.5em;
line-height: 150%;
}
a {
color: #A4E4F5;
}
a:hover {
text-decoration: none;
color: #FFFFFF;
}
img.left {
float: left;
margin: 4px 20px 0 0;
}
img.thumb {
float: left;
margin: 40px 10px 0 10px;
}
img.right {
float: left;
margin: 4px 0 0 20px;
}
.price
{
color: #000000;
}
td
{
text-align: center;
align: center;
}
/* Header */
#header {
height: 150px;
background: url(../images/img02.jpg) no-repeat center top;
text-transform: lowercase;
}
#logo {
float: left;
}
#logo h1, #logo p {
float: left;
margin: 0;
line-height: normal;
}
#logo h1 {
float: right;
padding: 25px 320px 0 0;
font-size: 3em;
color: #62D6F5;
}
#logo p {
float: right;
padding: 20px 500px 0 0;
letter-spacing: -1px;
font-size: 1.4em;
color: #199DD2;
}
#logo a {
text-decoration: none;
color: #62D6F5;
}
/* Menu */
#menu {
float: right;
}
#menu ul {
margin: 0;
padding: 30px 320px 0 0;
list-style: none;
}
#menu li {
display: inline;
}
#menu a {
float: left;
width: 120px;
height: 56px;
margin: 0 0 0 2px;
padding: 9px 0 0 0;
background: #1B97CE url(../images/img03.gif) no-repeat;
text-decoration: none;
text-align: center;
letter-spacing: -1px;
font-size: 1.1em;
font-weight: bold;
color: #000000;
}
#menu a:hover, #menu .current_page_item a {
background: #26BADF url(../images/img04.gif) no-repeat;
}
/* Page */
#page {
width: 784px;
margin: 0 auto;
}
/* Content */
#content {
float: left;
width: 530px;
padding: 0 0 0 25px;
}
.post {
margin-bottom: 15px;
background: #1EB5DD url(../images/img05.gif) no-repeat;
color: #0A416B;
}
.post a {
color: #A4E4F5;
}
.post a:hover {
color: #FFFFFF;
}
.post .title {
margin: 0;
padding: 30px 30px 0 30px;
}
.post .title a {
text-decoration: none;
color: #0A416B;
}
.post .byline {
margin: 0;
padding: 0 30px;
}
.post .entry {
padding: 20px 30px 10px 30px;
}
.post .entry2
{
padding: 0px 0px 0px 0px;
}
.post .content
{
padding: 0px 30px 10px 30px;
}
.post .links {
margin: 0;
padding: 10px 30px 35px 30px;
background: url(../images/img06.gif) repeat-x left bottom;
border-top: 1px solid #2872A6;
}
.post .links a {
padding-left: 10px;
background: url(../images/img08.gif) no-repeat left center;
text-decoration: none;
font-weight: bold;
color: #0A416B;
}
.post .links a:hover {
color: #FFFFFF;
}
/* Sidebars */
.sidebar {
float: left;
width: 100px;
}
.sidebar ul {
margin: 0;
padding: 0;
list-style: none;
line-height: normal;
}
.sidebar li {
}
.sidebar li ul {
}
.sidebar li li {
padding: 6px 0 6px 10px;
background: url(images/img08.gif) no-repeat 0 12px;
border-bottom: 1px solid #2872A6;
}
.sidebar li li a {
text-decoration: none;
color: #C9ECF5;
}
.sidebar li li a:hover {
color: #FFFFFF;
}
.sidebar li h2 {
padding-top: 20px;
color: #FFFFFF;
}
/* Left Sidebar */
#leftbar {
}
/* Right Sidebar */
#rightbar {
padding: 0 0 0 25px;
}
/* Search */
#searchform {
padding-top: 20px;
text-align: right;
}
#searchform br {
display: none;
}
#searchform input {
margin-bottom: 5px;
}
#searchform #s {
width: 190px;
}
/* Footer */
#footer {
clear: both;
padding: 40px 0;
background: #083253;
}
#footer p {
text-align: center;
font-size: smaller;
color: #0F5B96;
}
#footer a {
color: #0F5B96;
}
/*Start Pop up hint box */
#hintbox
{
position:absolute;
top: 0;
color: #C9ECF5;
background-color: #0F5B96;
width: 150px; /*Default width of hint.*/
padding: 3px;
border:1px solid black;
font:normal 11px Verdana;
line-height:18px;
z-index:100;
border-right: 3px solid black;
border-bottom: 3px solid black;
visibility: hidden;
}
.hintanchor
{
font-weight: bold;
/*color: red;*/
margin: 3px 8px;
}
/*End Pop up hint box*/