mac173
Member
- Messages
- 106
- Reaction score
- 1
- Points
- 18
I am using relative and absolute positioning to put a navigation pane to the left of my site. As you will see from the XHTML, the "container" and "sidemenu" div's are encompased in the "outer" div. I needed to do this to make the sidewindow links work.
The problem is, this functions fine in IE7, but the sidemenu does not even show up on Firefox.
Is this not supported in Firefox?
If it is, how do I get it to work?
Here is the relevant code:
css....
.outer
{
position:relative;
width:1000px;
height:100%;
border:dotted 1
}
.container
{
position:absolute;
left:165px;
background: url(img/XLbgcontainer.jpg) repeat-y center top;
margin: 0 auto;
width: 840px;
}
.sidemenu
{
position:absolute;
top:300px;
left:2px;
z-index:-1;
}
index.html
<body>
<div class="outer">
<div class="sidemenu">
<img src="img/XLmenu_top.gif" width="155" height="38" border="0"/></a></br>
<a href="crafting.html"><img src="img/XLmenu_crafting2.gif" width="155" height="38" border="0"/></a></br>
<a href="hobbies.html"><img src="img/XLmenu_hobbies.gif" width="155" height="38" border="0"/></a></br>
<a href="fishing.html"><img src="img/XLmenu_fishing.gif" width="155" height="38" border="0"/></a></br>
<a href="vocations.html"><img src="img/XLmenu_vocations.gif" width="155" height="38" border="0"/></a></br>
<a href="armorer.html"><img src="img/XLmenu_armorer2.gif" width="155" height="38" border="0"/></a></br>
<a href="armsman.html"><img src="img/XLmenu_armsman.gif" width="155" height="38" border="0"/></a></br>
<a href="explorer.html"><img src="img/XLmenu_explorer.gif" width="155" height="38" border="0"/></a></br>
<a href="professions.html"><img src="img/XLmenu_professions.gif" width="155" height="38" border="0"/></a></br>
<a href="#"><img src="img/XLmenu_blank.gif" width="155" height="38" border="0"/></a></br>
<img src="img/XLmenu_bottom.gif" width="155" height="38" border="0"/></a></br>
</div>
<div class="container">
...............................................................................................
The site as it is now is www.dorcraft.org
I do not have the new changes live yet, so if you need to see more of the code, tell me and I will copy the whole thing. Its not that big.
The problem is, this functions fine in IE7, but the sidemenu does not even show up on Firefox.
Is this not supported in Firefox?
If it is, how do I get it to work?
Here is the relevant code:
css....
.outer
{
position:relative;
width:1000px;
height:100%;
border:dotted 1
}
.container
{
position:absolute;
left:165px;
background: url(img/XLbgcontainer.jpg) repeat-y center top;
margin: 0 auto;
width: 840px;
}
.sidemenu
{
position:absolute;
top:300px;
left:2px;
z-index:-1;
}
index.html
<body>
<div class="outer">
<div class="sidemenu">
<img src="img/XLmenu_top.gif" width="155" height="38" border="0"/></a></br>
<a href="crafting.html"><img src="img/XLmenu_crafting2.gif" width="155" height="38" border="0"/></a></br>
<a href="hobbies.html"><img src="img/XLmenu_hobbies.gif" width="155" height="38" border="0"/></a></br>
<a href="fishing.html"><img src="img/XLmenu_fishing.gif" width="155" height="38" border="0"/></a></br>
<a href="vocations.html"><img src="img/XLmenu_vocations.gif" width="155" height="38" border="0"/></a></br>
<a href="armorer.html"><img src="img/XLmenu_armorer2.gif" width="155" height="38" border="0"/></a></br>
<a href="armsman.html"><img src="img/XLmenu_armsman.gif" width="155" height="38" border="0"/></a></br>
<a href="explorer.html"><img src="img/XLmenu_explorer.gif" width="155" height="38" border="0"/></a></br>
<a href="professions.html"><img src="img/XLmenu_professions.gif" width="155" height="38" border="0"/></a></br>
<a href="#"><img src="img/XLmenu_blank.gif" width="155" height="38" border="0"/></a></br>
<img src="img/XLmenu_bottom.gif" width="155" height="38" border="0"/></a></br>
</div>
<div class="container">
...............................................................................................
The site as it is now is www.dorcraft.org
I do not have the new changes live yet, so if you need to see more of the code, tell me and I will copy the whole thing. Its not that big.