Good Evening all,
I've had a problem that has plagued me for days now. I am building a website in Joomla, see
http://erasofstyle.com/beta/index.php.
The only issue I am now having is that the drop down menu does not appear to be working in IE. All the text on said drop down box does not display in IE, but appears to work in firefox and chrome.
I would assume that this is a CSS issue, and so include the CSS as follows:
Code:
html {
height: 100%;
}
body{
margin:0;
padding:0;
text-align:center;
background:#221b12 url(../images/dolmatia-bg.jpg) repeat;
font-size:13px;
color:#fff;
font-family: Trebuchet MS, Trebuchet MS1, Helvetica, sans-serif;
font-weight:normal;
}
/*texte*/
p {
font-size: 100%;
text-align:left;
}
h1 {
font-size: 200%;
}
h2 {
font-size: 150%;
}
h3 {
font-size: 125%;
}
h4, h5, h6 {
font-size: 100%;
}
/* liens hypertextes*/
a:link, a:visited {
text-decoration:none;
color:#ffffff;
font-weight:bold;
}
a:hover {
color:#9fbf3a;
}
/*listes a puces*/
ul {
margin:0;
padding-left:0px;
}
li {
list-style-type:circle;
background:transparent;
margin: 4px;
}
/*image*/
img {
border:none;
margin:0px 5px;
padding:0;
}
img .caption {
text-align: left;
}
.highlight{
background:#9fbf3a;/*VERT*/
padding: 0px 2px 0px 2px;
color:#ffffff;
}
.button {
background:#9fbf3a;/*VERT*/
border:none;
color:#ffffff;
font-weight:normal;
padding:4px;
}
.inputbox {
color:#26211e;
background:#fcfdfa;
border:none;
padding:4px;
font-weight:bold;
}
.pagewidth{
width:940px;
text-align:center;
background:transparent;
margin-left:auto;
margin-right:auto;
margin-top:0px;
margin-bottom:0px;
position:relative;
}
fieldset {
margin:0px 5px 5px 5px;
padding:5px;
border:1px solid #222222;
}
.clr {
clear:both;
}
/********************************************/
/***********HEADER***************************/
/*******************************************/
#header {
width:940px;
height:150px;
background:transparent;
margin:0;
}
#pathway {
float:left;
width:100%;
height:13px;
font-size:12px;
font-weight:normal;
margin:25px 0 0 0;
padding:0 10px;
text-align:left;
}
/********************************************/
/***********TOPMENU************************/
/*******************************************/
#topmenu {
float:left;
width:940px;
height:59px;
background:transparent url(../images/dolmatia-topmenu-bg.png) top center no-repeat;
margin:25px 0 0 0 ;
padding:0;
}
#navigation {
float:left;
height: 59px;
width:679px;
float:left;
text-transform: capitalize;
text-align:left;
background:transparent;
padding:0;
}
#navigation a {
display: block;
float: left;
height: 39px;
padding-left:20px ;
padding-right:20px;
padding-top:20px;
font-weight:bold;
color:#fff;
font-size:18px;
font-weight:bold;
border-right:1px solid #2a231b;
text-align:left;
z-index: 999;
}
#navigation a:hover{
color: #9fbf3a;
}
#navigation ul {
list-style: none;
margin: 0px ;
padding: 0px;
}
#navigation li {
display: block;
float: left;
margin:0 ;
padding: 0 ;
}
#navigation li li a {
font-size: 15px;
padding-left:20px ;
padding-right:20px;
padding-top:20px;
margin: 0;
color:#fff;
}
#navigation li li {
border-bottom: 1px solid #2a231b;
border-left:1px solid #2a231b;
background: url(../images/bgmenuli.jpg) repeat;
}
.nav, .nav * {
margin: 0;
padding:0;
}
div#navigation {
position: relative;
z-index: 50;
}
#navigation li li {
margin:0 0 0 -1px;
}
.nav {
line-height:1.0;
float:left;
margin-bottom:0em;
position: relative;
}
.nav ul {
background:transparent;
padding: 0;
margin-top:10px !important;
}
.nav li {
float:left;
list-style:none;
position:relative;
background:none;
}
.nav li li a {
display:block;
padding: 0;
margin:0 ;
text-decoration:none;
background-image: none;
float:none;
width:135px;
z-index: 135;
}
.nav li ul {
float:none;
left:-999em;
position:absolute;
width: 177px;
z-index: 35;
}
.nav li:hover ul,
.nav li.sfHover ul {
left:0px;
top: 48px;
}
.nav li:hover li ul,
.nav li.sfHover li ul,
.nav li li:hover li ul,
.nav li li.sfHover li ul,
.nav li li li:hover li ul,
.nav li li li.sfHover li ul {
top:-999em;
}
.nav li li:hover ul,
.nav li li.sfHover ul,
.nav li li li:hover ul,
.nav li li li.sfHover ul,
.nav li li li li:hover ul,
.nav li li li li.sfHover ul {
left: 177px;
top:0px;
width: 177px;
}
.nav li li {
position: relative;
float:none;
width: 177px;
}
There is more to this css, but the rest would appear irrelevant.
Any help would be greatly appreciated!
Before you post, read our: 
