Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Aug 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    IE image link problem

    http://www.thefish.soulrinse.com/
    Code:
    <HEAD>
    <TITLE>thefishlayout3</TITLE>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
      <script src="/js/escram.js" language="javascript" type="text/javascript"></script>
      <script src="../js/preload.js" language="javascript" type"text/javascript"></script>
    
    <STYLE TYPE="text/css">
    body {
      margin:0;
      padding:0;
      background:#000;
      }
    
    img {
      border:0;
      margin-bottom:0;
      }
    a img {
      text-decoration:none;
      border:0;
      margin:0;
      padding:0;
      }
    
    #box {
      margin:0 auto;
      width:685px;
      height:526px;
      }
    #right_col {
      float:right;
      width:97px;
      height:526px;
      background:#aaa;
      }
    #top_right {
      width:97px;
      height:207px;
      background:url("images/top_right.jpg") no-repeat;
      }
    #bottom_right {
      width:97px;
      height:319px;
      background:url("images/right_side.gif") no-repeat;
      }
    #main {
      width:396px;
      height:526px;
      background:url("images/main_bg.jpg") no-repeat;
      float:right
      }
    
    #left_col {
      width:191px;
      height:526px;
      background:#fff;
      float:right;
      }
    #top_left {
      width:191px;
      height:207px;
      background:url("images/top_left.jpg") no-repeat;
      }
    #bottom_left {
      width:78px;
      height:319px;
      background:url("images/left_side.jpg") no-repeat;
      float:left;
      }
    #menu {  
      text-align:center;
      width:113px;
      height:319px;
      float:right;
      }
      
    </STYLE>
    </HEAD>
    
    <BODY ONLOAD="preloadImages();">
    <map name="right_side_Map">
    <area shape="circle" alt="Extras" coords="26,194,19" href="../extras.html" />
    </map>
    
    <div id="box">
      <div id="right_col">
        <div id="top_right">&nbsp;</div>
        <div id="bottom_right"><img src="images/right_side.gif" border=0 usemap="#right_side_Map"></div>
      </div>
      <div id="main">&nbsp;</div>
      <div id="left_col">
        <div id="top_left">&nbsp;</div>
        <div id="bottom_left">&nbsp;</div>
        <div id="menu">
        <a href="../index.html" onmouseover="changeImages('thefish_logo', 'images/thefish_logo-over.jpg'); return true;" onmouseout="changeImages('thefish_logo', 'images/thefish_logo.jpg'); return true;"> <img name="thefish_logo" src="images/thefish_logo.jpg" width=113 height=23 border=0 alt="Home" /></a>
        <a href="../news.html" onmouseover="changeImages('news', 'images/news-over.jpg'); return true;" onmouseout="changeImages('news', 'images/news.jpg'); return true;"> <img name="news" src="images/news.jpg" width=113 height=24 border=0 alt="News" /></a>
        <a href="../events/" onmouseover="changeImages('events', 'images/events-over.jpg'); return true;" onmouseout="changeImages('events', 'images/events.jpg'); return true;"> <img name="events" src="images/events.jpg" width=113 height=24 border=0 alt="Event Calendar" /></a>
        <a href="../sponsors.html" onmouseover="changeImages('sponsors', 'images/sponsors-over.jpg'); return true;" onmouseout="changeImages('sponsors', 'images/sponsors.jpg'); return true;"> <img name="sponsors" src="images/sponsors.jpg" width=113 height=25 border=0 alt="Sponsors" /></a>
        <a href="../bands.html" onmouseover="changeImages('bands', 'images/bands-over.jpg'); return true;" onmouseout="changeImages('bands', 'images/bands.jpg'); return true;"> <img name="bands" src="images/bands.jpg" width=113 height=25 border=0 alt="Bands" /></a></td>
        <a href="../gallery.html" onmouseover="changeImages('photos', 'images/photos-over.jpg'); return true;" onmouseout="changeImages('photos', 'images/photos.jpg'); return true;"> <img name="photos" src="images/photos.jpg" width=113 height=22 border=0 alt="Photos" /></a>
        <a href="../devos.html" onmouseover="changeImages('devos', 'images/devos-over.jpg'); return true;" onmouseout="changeImages('devos', 'images/devos.jpg'); return true;"> <img name="devos" src="images/devos.jpg" width=113 height=26 border=0 alt="Devos" /></a>
        <a href="../groups.html" onmouseover="changeImages('smallgroups', 'images/smallgroups-over.jpg'); return true;" onmouseout="changeImages('smallgroups', 'images/smallgroups.jpg'); return true;"> <img name="smallgroups" src="images/smallgroups.jpg" width=113 height=22 border=0 alt="Small Groups" /></a>
        <img src="images/menu_bottom.jpg" width=113 height=128 alt="" />
        </div>
      </div>
    </div>
    
    
    </BODY>
    -----

    In Firefox, the layout renders correctly. In IE, the image links (in the "menu" div) have a bottom margin that shouldn't be there. Does anyone have an idea what the problem could be? Thanks.

    EDIT: It just broke in Firefox too.
    Last edited by etmopterus; 08-20-2005 at 01:09 AM.

  • #2
    New Coder
    Join Date
    Aug 2005
    Location
    Groningen, Netherlands
    Posts
    57
    Thanks
    0
    Thanked 6 Times in 6 Posts
    Hmmm, your code is quiet unreadable... could you repost the code with indents for every div? That way, it is always better to see what div is used, what div is open.... where are we now?

    Don't care about the extra spaces, you won't see the difference in pageloading times.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •