My site renders correctly in firefox but in IE it doesnt render correctly. The site is http://www.cubetec.co.za/wordpress/
The content is overlapping the left menu when it shouldn't
I have bold where i think the problems could be but when i make changes it doesn't render properly.
I have also attached the css file for easier viewing.
Thanks
Code:
.clear{ clear:both; line-height:0px; height:0px; font-size:0px; border:none; margin:0; padding:0;}
#top {
width: auto;
height:180px;
padding-left: 50%;
margin-left: 0px;
background-repeat: no-repeat;
background-position:center;
text-align: center;
background-image: url(images/header.jpg);
padding-right: 50%;
}
h1 {
margin: 0; padding: 5px;
font-size: 46px;
color: #fff;
text-transform: uppercase;
font-family: Arial;
letter-spacing: -0.05em;
}
#title a {
color: #fff;
}
#header {
/*background-image: url('headerbg.gif'); background-color: #37b9e9;
background-position:center;*/
background-repeat: no-repeat /*center top fixed*/;
height: 180px;
width: 100%;
}
#header h2 {
color: #fff;
font-size: 18px;
margin: 0; padding: 5px;
width: 400px;
letter-spacing: normal;
font-family: "Avant Garde", "Century Gothic";
}
#navmenu ul {
margin: 0;
padding: 0;
list-style-type: none;
list-style-image: none;
text-align: center;
word-spacing: normal;
}
#navmenu li {
display: inline;
text-align: center;
}
#navmenu ul li a {
text-decoration:none;
margin: 4px;
color: #F60;
background-color: #FFF;
padding-top: 5px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 10px;
text-align: center;
}
#navmenu ul li a:hover {
color: #333;
font-size: medium;
background-color: #FFF;
margin: 4px;
padding-top: 5px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 10px;
text-align: center;
}
#rss {
position: absolute; top: 0; right: 25px;
background-image: url(rss.gif); background-repeat: no-repeat;
width: 87px; height: 62px; overflow: hidden;
float: left;
}
#rss a {
padding-left: 87px;
line-height: 62px;
}
#subtitle {
position: absolute;
top: 82px;
left: 0;
background-image: url(subtitle.gif);
width: 469px;
height: 111px;
}
#navmenu {
padding-left: 0px;
text-align: center;
width: auto;
}
.mcategory {
background-image: url(icons/folder.gif);
background-repeat: no-repeat;
background-position: left;
padding-left: 18px;
padding-top: 2px;
float: left;
}
.mtags {
background-image: url(icons/tag.gif);
background-repeat: no-repeat;
background-position: left;
padding-left: 18px;
padding-top: 2px;
float: left;
}
.mauthor {
background-image: url(icons/author.gif);
background-repeat: no-repeat;
background-position: right;
padding-left: 18px;
padding-top: 2px;
}
.mcomments {
background-image: url(icons/comment.gif);
background-repeat: no-repeat;
background-position: left;
padding: 2px 0 0 18px;
margin: 0 3px 0 0;
float: right;
}
.mdate {
background-image: url(icons/calendar.gif);
background-repeat: no-repeat;
background-position: left;
padding: 0 0 0 18px;
margin: 0 0 15px 0;
}
p {
font-family: Arial;
font-size: 0.9em;
color: #7b7b7b;
}
a {
color: #F35820;
text-decoration: none;
}
a img {
border: none;
}
a:visited {
color: #666;
}
a:hover {
color: #F60;
}
acronym, abbr {
border-bottom: 1px dashed #333;
}
acronym, abbr, span.caps {
font-size: 90%;
letter-spacing: .07em;
}
acronym, abbr {
cursor: help;
}
blockquote {
border-left: 5px solid #ccc;
margin-left: 1.5em;
padding-left: 5px;
font-size: 0.9em;
}
html, body {
background: #fff;
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
margin: 0;
padding: 0;
width: 100%;
}
cite {
font-size: 90%;
font-style: normal;
}
.post {
position: relative;
display: block;
width: 100%;
}
h2 {
color: #7b7b7b;
font-family: Arial;
font-size: 12px;
letter-spacing: 2px;
margin-top: 0px;
font-weight: normal;
}
h3 {
font-family: Arial;
color: #FC0;
font-size: 24px;
font-weight: normal;
margin-bottom: 0;
padding-bottom: 0;
}
h4 {
font-family: Verdana, Arial;
font-size: 1.2em;
color:#FC0;
letter-spacing: -2px;
font-weight: normal;
padding-bottom: 2px; /*border-bottom: dotted 1px #ccc;*/
margin-top: 10px;
text-transform: lowercase;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-left: 0;
text-align: center;
background-color: #666;
}
#commentlist ul {
list-style: none;
}
#commentlist li {
background-image: url(comments.gif);
background-repeat: no-repeat;
border-bottom: 1px solid #d1edf4;
padding-left: 20px;
list-style: none;
}
ul#comments li p {
font-size: 1em;
color: #7b7b7b;
}
ul#comments li p cite {
font-size: 1em;
}
/* classes used by the_meta() */
ul.post-meta {
list-style: none;
}
ul.post-meta span.post-meta-key {
font-weight: bold;
}
.credit {
background: #90a090;
border-top: 3px double #aba;
color: #fff;
font-size: 11px;
margin: 10px 0 0 0;
padding: 3px;
text-align: center;
}
.credit a:link, .credit a:hover {
color: #fff;
}
.feedback {
color: #7b7b7b;
text-align: right;
clear: both;
font-size: 0.9em;
}
#editbutton {
font-size: 0.7em;
position: absolute; top: 0; right: 0;
z-index: 2;
}
.fcontainer {
position: relative;
color: #7b7b7b;
font-size: 0.8em;
line-height: 18px;
font-family: Arial;
font-weight: normal;
background-color:#d1edf4;
width: 100%;
padding: 0 3px 4px 3px;
height: 18px;
margin: 10px 0 15px 0;
}
.fcontainer ul {
display: inline;
list-style: none;
}
.fcontainer ul li {
list-style: none;
}
.storytitle {
position: relative;
text-decoration:none;
padding: 0 0 5px 0;
color: #9ad149;
font-family: Trebuchet MS;
}
.storytitle a {
text-decoration: none;
color: #F60;
}
.storycontent {
position: relative;
width: 100%;
font-family: Arial;
font-size: 0.8em;
letter-spacing: normal;
color: #7b7b7b;
margin-top: -7px;
line-height: normal;
color: #5e5e5e;
}
.storycontent p {
margin: 0;
padding: 3px 0 3px 0;
color: #5e5e5e;
}
.storycontent img {
padding: 4px;
border: 1px solid #ccc;
}
.alignright {
float: right;
margin: 0 0 0 10px;
}
.alignleft {
float: left;
margin: 0 10px 0 0;
}
.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.storycontent h1 {
font-family: Verdana;
font-size: 1em;
font-weight: bold;
color: #7b7b7b;
margin: 0;
padding: 3px 0 3px 0;
}
.storycontent ul {
font-family: Arial;
font-size: 0.9em;
color: #7b7b7b;
}
#commentform #author, #commentform #email, #commentform #url, #commentform textarea {
background: #d1edf4;
border: 1px solid #99bbd0;
padding: 0.2em;
color: #666;
}
#commentform textarea {
width: 100%;
}
#commentlist li ul {
border-left: 1px solid #ddd;
font-size: 110%;
list-style-type: none;
font-size: 0.9em;
color: #7b7b7b;
}
#commentext {
font-size: 1em;
}
#content {
background-repeat: repeat-x;
background-position: top;
width: 100%;
padding-top: 24px;
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -20px; /* the bottom margin is the negative value of the footer's height */
clear: both;
background-color: #FFF;
background-image: url(pageshadow_2.gif);
}
#cpadding {
position: relative;
padding-left: 10px;
padding-right: 10px;
width: 960px;
margin-left: auto;
margin-right: auto;
}
.pcetc {
position: relative;
margin-left: auto;
margin-right: auto;
}
.pcetcc {
position: relative;
margin-left: auto;
margin-right: auto;
width: 600px;
}
#menu {
position: absolute;
left:0;
top:0;
width: 170px;
height: auto;
background-image: url(images/Leftnav-block.jpg);
}
#menu form {
margin: 0 0 0 13px;
}
#menu input#s {
width: 80%;
background: #eee;
border: 1px solid #999;
color: #000;
}
#menu ul {
font-variant: normal;
font-weight: normal;
line-height: 100%;
list-style-type: none;
margin: 0;
padding: 0;
text-align: left;
}
#menu ul li {
font-family: Arial;
font-size: 0.7em;
color: #c3c3c3;
letter-spacing: 0;
margin-top: 0;
padding: 2px 0 0 5px;
margin: 0 0 -1px 0;
list-style: none;
color: #26b9e3;
border-top-width: 0.5px;
border-right-width: 0;
border-bottom-width: 0.5px;
border-left-width: 0;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-top-color: #d1edf4;
border-bottom-color: #d1edf4;
}
#menu ul li a {
color: #F60;
text-decoration: none;
}
#menu ul li a:hover {
text-decoration:none;
}
#menu ul li:hover {
background-color: #666;
}
#menu ul ul.children {
padding-left: 4px;
}
.menu form {
margin: 0 0 0 13px;
}
.menu input#s {
width: 80%;
background: #eee;
border: 1px solid #999;
color: #000;
}
.menu ul {
font-weight: bold;
list-style-type: none;
margin: 0;
padding-left: 3px;
text-transform: capitalize;
}
.menu li {
font-family: Verdana, Arial;
font-size: 1.2em;
color:#666;
letter-spacing: -2px;
font-weight: normal;
margin-top: 10px;
padding-bottom: 2px;
}
.menu ul {
font-variant: normal;
font-weight: normal;
line-height: 100%;
list-style-type: none;
margin: 0;
padding: 0;
text-align: left;
color: #999;
}
.menu ul li {
font-size: 0.7em;
color: #c3c3c3;
letter-spacing: 0;
margin-top: 0;
padding: 2px 0 0 5px;
margin: 0 0 -1px 0;
list-style: none;
color: #26b9e3;
border-top-width: 1px;
border-right-width: 0;
border-bottom-width: 1px;
border-left-width: 0;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-top-color: #d1edf4;
border-bottom-color: #d1edf4;
}
div.breadcrumb{ background:#f8f8f8; padding:10px 10px 10px 30px;}
.breadcrumb{
font-size:12px;
color:#b8b8b8;
}
.breadcrumb a:link, .breadcrumb a:visited{color:#699eb6; text-decoration:none;}
.breadcrumb a:hover{color:#47798f; background:#FFC; text-decoration:underline;}
.menu ul li a {
color: #F60;
text-decoration: none;
}
.menu ul li a:hover {
text-decoration:none;
}
.menu ul li:hover {
background-color: #666;
}
.menu ul ul.children {
padding-left: 4px;
}
#rside {
position: absolute;
top: 0;
right: 0;
width: 165px;
text-transform: capitalize;
background-image: url(images/Leftnav-block.jpg);
height: auto;
}
#rside div {
color: #7b7b7b;
font-size: 0.7em;
}
#footer {
clear: both;
padding: 4px;
margin: 20px auto;
color: #F60;
font-size: 0.7em;
letter-spacing: 1px;
width: 600px;
border-top: 1px solid #ccc;
text-align: center;
background-image: url(pageshadow.gif);
background-repeat: repeat-x;
background-position: bottom;
}
#footer p {
padding: 3px; margin: 0;
width: 50%;
float: right;
text-align: right;
}
#o40img {
background: #fff url(040cred.gif) no-repeat;
width: 110px; height: 23px;
}
#o40img a {
background: #fff url(040cred.gif) no-repeat;
display: block;
width: 110px; height: 23px;
}
#o40img a span {
visibility: hidden;
}
input#s{
border:1px solid #ccc;
}
input#s:focus{
border:1px solid #38C;
}
#imgsbutton {
margin-top: 5px;
}
#work {
margin-top: 30px;
}
#searchform {
position: relative;
}
#comments {
list-style: none;
margin: 0; padding: 15px 0 0 0;
font-size: 0.8em;
color: #5e5e5e;
}
#comments li {
padding: 5px; margin: 2px
}
.comment-date {
text-transform: uppercase;
font-size: 0.8em; color: #ccc;
}
.author {
font-weight: bold;
}
.odd {
border-bottom: 1px solid #ccc;
}
.even {
border-bottom: 1px solid #ccc;
}
.comment-text {
}
|
