CSS Mouseover

  • BravoGolf
  • Newbie
  • Newbie
  • BravoGolf
  • Posts: 13
  • Loc: New York

Post 3+ Months Ago

Hello.
On my site: http://www.eye-floaters.com. On the left is a navigational div tag that specifies when the mouse moves over this tag the background colour changes. This works fine, however when the colour changes the voting poll underneath moves down a few pixels (and continues to move down as one moves the mouse over the div tag!).

It works fine in Opera, but not at all in IE. I'm absolutely stumped here folks, no idea what the issue is!

Can anyone please please please help!?

Extract of CSS code is as follows for the left hand column:
Code: [ Select ]
<!-- Left Column Begins here -->
<DIV id="lhcol">
 <DIV class="lhcont" onmouseover="this.className='lhconttableover'" onmouseout="this.className='lhcont'">
  <UL>
   <LI class="navhdr"> <A class="lhdr" title=Home accessKey=h href="index.php">EYE FLOATERS HOME</A>
   <LI>
    <UL>
     <LI class="navitem"><A class="nav" title="About this site" href="about.php"><strong>A</strong>bout</A>
     <LI class="navitem2"><A class="nav" title="Contact Us" href="contact.php"><strong>C</strong>ontact</A>
     </LI>
    </UL>
   <LI class="navhdr"><A class="lhdr" title="Guides" href="theeye.php">THE EYE</A>
    <!-- How the eye works, faq's etc -->
   <LI><a href="floaters.php" class="lhdr">FLOATERS</a>
    <!-- What floaters are, causes of floaters, treatment of floaters .. -->
   <LI><a href="articles.php" title="Articles and Further reading" class="lhdr">ARTICLES</a>
    <!-- Links to various published articles -->
   <LI><a href="bulletin/index.php" title="Eye Floaters Discussion Forum" class="lhdr">COMMUNITY FORUM</a>
    <!-- Which will then link to Contact Form and discussion group -->
   <LI><a href="links.php" class="lhdr" title="Links and Resources">LINKS</a> </UL>
  <BR>
  <DIV> </DIV>
 </DIV>
 <!-- end lhcont --><BR>

<!-- Left Column Text here -->
<div class="left_col_cont">
<p class="left_col_hdr" id=customise>&nbsp;&nbsp;»&nbsp;Customise</p>
<DIV class="mailform " onmouseover="HighlightBackground(customise, '#EDEFF8');" onmouseout="HighlightBackground(customise, '#dcdcdc');">
 <span style="color:#4393B8;font-size:x-small;font-weight:normal;padding-right:10px">Font size: </span>
 <a href="#" onclick="setActiveStyleSheet('SmallFonts'); return false;" class="SmallFonts" title="Default size Fonts">a</a>
 <a href="#" onclick="setActiveStyleSheet('MediumFonts'); return false;" class="MediumFonts" title="Medium Large Fonts">a</a>
 <a href="#" onclick="setActiveStyleSheet('LargeFonts'); return false;" class="LargeFonts" title="Large Fonts">a</a>
</div></div>
<br>
<?php
include_once "/home/floaters/public_html/poll/booth.php";
echo $php_poll->poll_process(4);
?>
</DIV>
  1. <!-- Left Column Begins here -->
  2. <DIV id="lhcol">
  3.  <DIV class="lhcont" onmouseover="this.className='lhconttableover'" onmouseout="this.className='lhcont'">
  4.   <UL>
  5.    <LI class="navhdr"> <A class="lhdr" title=Home accessKey=h href="index.php">EYE FLOATERS HOME</A>
  6.    <LI>
  7.     <UL>
  8.      <LI class="navitem"><A class="nav" title="About this site" href="about.php"><strong>A</strong>bout</A>
  9.      <LI class="navitem2"><A class="nav" title="Contact Us" href="contact.php"><strong>C</strong>ontact</A>
  10.      </LI>
  11.     </UL>
  12.    <LI class="navhdr"><A class="lhdr" title="Guides" href="theeye.php">THE EYE</A>
  13.     <!-- How the eye works, faq's etc -->
  14.    <LI><a href="floaters.php" class="lhdr">FLOATERS</a>
  15.     <!-- What floaters are, causes of floaters, treatment of floaters .. -->
  16.    <LI><a href="articles.php" title="Articles and Further reading" class="lhdr">ARTICLES</a>
  17.     <!-- Links to various published articles -->
  18.    <LI><a href="bulletin/index.php" title="Eye Floaters Discussion Forum" class="lhdr">COMMUNITY FORUM</a>
  19.     <!-- Which will then link to Contact Form and discussion group -->
  20.    <LI><a href="links.php" class="lhdr" title="Links and Resources">LINKS</a> </UL>
  21.   <BR>
  22.   <DIV> </DIV>
  23.  </DIV>
  24.  <!-- end lhcont --><BR>
  25. <!-- Left Column Text here -->
  26. <div class="left_col_cont">
  27. <p class="left_col_hdr" id=customise>&nbsp;&nbsp;»&nbsp;Customise</p>
  28. <DIV class="mailform " onmouseover="HighlightBackground(customise, '#EDEFF8');" onmouseout="HighlightBackground(customise, '#dcdcdc');">
  29.  <span style="color:#4393B8;font-size:x-small;font-weight:normal;padding-right:10px">Font size: </span>
  30.  <a href="#" onclick="setActiveStyleSheet('SmallFonts'); return false;" class="SmallFonts" title="Default size Fonts">a</a>
  31.  <a href="#" onclick="setActiveStyleSheet('MediumFonts'); return false;" class="MediumFonts" title="Medium Large Fonts">a</a>
  32.  <a href="#" onclick="setActiveStyleSheet('LargeFonts'); return false;" class="LargeFonts" title="Large Fonts">a</a>
  33. </div></div>
  34. <br>
  35. <?php
  36. include_once "/home/floaters/public_html/poll/booth.php";
  37. echo $php_poll->poll_process(4);
  38. ?>
  39. </DIV>
  • BravoGolf
  • Newbie
  • Newbie
  • BravoGolf
  • Posts: 13
  • Loc: New York

Post 3+ Months Ago

Scratch that, I solved it :lol:

Turns out the issue was related to the padding: 3px; statements :)

Post Information

  • Total Posts in this topic: 2 posts
  • Users browsing this forum: No registered users and 22 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.