Different height in IE and Opera
Hi,
This is what my page looks like in IE and Opera: (resized to 60% limit the filesize)
http://w1.481.telia.com/~u48111784/different.jpg
I want it to look like it does in Opera in IE as well.
calendar.php (the relevant part)
Code:
<body>
<!-- here's some code for the top menu that I've cut out -->
<div id="leftnav">
<a href="../index.html" class="top"><img src="../akrahall.gif" alt="Åkrahäll" /></a>
<ul>
<li><a href="./calendar.php?day=1&month=1&year=<?php echo $aYear;?>"<?php echo ($aMonth == '1')?' class="active"':''; ?>>Januari</a></li>
<li><a href="./calendar.php?day=1&month=2&year=<?php echo $aYear;?>"<?php echo ($aMonth == '2')?' class="active"':''; ?>>Februari</a></li>
<li><a href="./calendar.php?day=1&month=3&year=<?php echo $aYear;?>"<?php echo ($aMonth == '3')?' class="active"':''; ?>>Mars</a></li>
<li><a href="./calendar.php?day=1&month=4&year=<?php echo $aYear;?>"<?php echo ($aMonth == '4')?' class="active"':''; ?>>April</a></li>
<li><a href="./calendar.php?day=1&month=5&year=<?php echo $aYear;?>"<?php echo ($aMonth == '5')?' class="active"':''; ?>>Maj</a></li>
<li><a href="./calendar.php?day=1&month=6&year=<?php echo $aYear;?>"<?php echo ($aMonth == '6')?' class="active"':''; ?>>Juni</a></li>
<li><a href="./calendar.php?day=1&month=7&year=<?php echo $aYear;?>"<?php echo ($aMonth == '7')?' class="active"':''; ?>>Juli</a></li>
<li><a href="./calendar.php?day=1&month=8&year=<?php echo $aYear;?>"<?php echo ($aMonth == '8')?' class="active"':''; ?>>Augusti</a></li>
<li><a href="./calendar.php?day=1&month=9&year=<?php echo $aYear;?>"<?php echo ($aMonth == '9')?' class="active"':''; ?>>September</a></li>
<li><a href="./calendar.php?day=1&month=10&year=<?php echo $aYear;?>"<?php echo ($aMonth == '10')?' class="active"':''; ?>>Oktober</a></li>
<li><a href="./calendar.php?day=1&month=11&year=<?php echo $aYear;?>"<?php echo ($aMonth == '11')?' class="active"':''; ?>>November</a></li>
<li><a href="./calendar.php?day=1&month=12&year=<?php echo $aYear;?>"<?php echo ($aMonth == '12')?' class="active"':''; ?>>December</a></li>
</ul>
</div>
<!-- here comes the rest of the page -->
</body>
global.css (again, only the relevant parts)
Code:
body
{
margin: 0;
padding: 0;
background-color: #FFF; /* same as #FFFFFF */
font-family: Verdana;
font-size: 0.9em;
background: #FFF url('./Menu/bg_left.gif') repeat-y top left;
}
#leftnav
{
position: absolute;
top: 0;
left: 0;
width: 200px;
height: 100%;
background: #DAE0D2 url("./Menu/bg_leftnav.gif") repeat-y right;
clear: both;
}
#leftnav a.top
{
display: block;
background: transparent url('./Menu/bg_upperleft.gif') no-repeat scroll top right;
border: 0;
}
#leftnav a
{
display: block;
color: #765;
text-decoration: none;
}
#leftnav a:hover
{
color: #000;
}
#leftnav img
{
border: 0;
}
#leftnav ul
{
position: relative;
left: -20px;
font-size: 1.1em;
list-style-type: none;
color: #765;
line-height: 1.2em;
}
#leftnav li
{
padding: 0 0 0 15px;
background: transparent url('./Menu/n_br.gif') no-repeat scroll top left;
}
I think it might have to do with the display: block; on #leftnav a but I'm not sure
What can I do to make it look like it does in Opera in IE?
