<em>I just posted this in the wrong forum so sorry if anyone gets a
dup!</em>
I'm working on a slide down horizontal menu and I'm having issues
getting the border around the submenu to display correctly. I'm
trying
to get a 1px border on the left and right side and an image on the
bottom for rounded corners. I finally got it to display correctly in
FF but now the right border is 2px instead of 1px in IE because of
the
way I had to clip 2px off the right for FF. Any ideas on how to
adjust
this to make it possible? Thanks.
<code>
<html>
<head>
<title>test</title>
<style>
/*Styles for level 0*/
..clLevel0,.clLevel0over{display: inline; position:absolute;
padding-right: 4px;
padding-bottom: 0px;
padding-top: 6px;
font-family:arial,helvetica; font-size:8pt; font-weight:bold;
border-bottom: 0px solid #f0b319;}
..clLevel0{background-color:#ffffff; color:#115d95;
}
..clLevel0over{background-color:#f0b319; color:#000080;
cursor:pointer; }
..clLevel0border{display: inline; position:absolute; visibility:hidden;
background-color:#ffffff; }
/*Styles for level 1*/
..clLevel1, .clLevel1over{clear: both; display: inline;
position:absolute; padding:0px; font-family:arial,helvetica; font-size:
8pt; font-weight:bold; padding-bottom: 5px;
}
..clLevel1{background-color:yellow; color:#115d95; }
..clLevel1over{background-color:#115d95; color:#f0b319;
cursor:pointer; }
..clLevel1border{position:absolute; visibility:hidden; background-
color:#f0b319;}
..clLevel1bottom, .clLevel1bottomover{position:absolute; padding:0px;
background-color:#fdf7e8;
background-image: url(images/pulldown-bottom.gif);
background-position: center;
background-repeat: no-repeat;
}
</style>
</head>
<body>
<table width="780">
<tr>
<td>
<div style="position: relative; text-align: left;">
<script type="text/javascript"</script>
<div style="z-index: 2; clip: rect(0px, 65px, 24px, 0px); width: 65px;
height: 24px; left: 0px; top: 0px; visibility: visible;"
id="oCMenu_top0_0" class="clLevel0border">
<div style="z-index: 4; clip: rect(0px, 65px, 24px, 0px); width: 65px;
height: 24px; left: 0px; top: 0px;" id="oCMenu_top0" class="clLevel0">
COMPANY </div>
</div>
<div style="overflow: hidden; z-index: 13; visibility: visible;
clip: rect(0px, 200px, 55px, 0px); width: 200px; height: 55px; left:
0px; top: 25px;" id="oCMenu_1_0" class="clLevel1border">
<div style="z-index: 15; left: 0px; top: 0px; clip: rect(0px, 200px,
20px, 0px); width: 198px; height: 20px; visibility: inherit;"
id="oCMenu_sub00" class="clLevel1"Campus University Wide Link </div>
<div style="z-index: 16; left: 0px; top: 20px; clip: rect(0px,
200px, 20px, 0px); width: 198px; height: 20px; visibility: inherit;"
id="oCMenu_sub01" class="clLevel1"Company2 </div>
<div style="z-index: 17; left: 0px; top: 40px; clip: rect(0px,
200px, 15px, 0px); width: 200px; height: 15px; visibility: inherit;"
id="oCMenu_sub02" class="clLevel1bottom"></div>
</div>
</div>
</td>
</tr>
</table>
</body>
</html>
</code>
