SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Mar 2003
    Location
    Greenville, SC
    Posts
    388
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    a small it 2 pixel gap issue with a box in a column.

    hello folks,
    please look at this page:

    http://preview.zero1productions.com/...dex_layout.php

    Everything seems to be coming along smoothly except for one issue:

    on the box labeled "News Box" there is a 2 pixel gap between the tiling middle and bottom footer image in IE6 and 7 Beta3. (It's not hard to miss.)Firefox of course, got it right.

    here is the code for the box:
    CSS:
    Code:
    #divLeftColumn h4 {
    border: 0px solid purple;
    width: 237px;
    height: 36px;
    margin-left: 5px;
    margin-top: -5px;
    margin-bottom: -1px;
    }
    
    h4#NewsBox {
    background:url("../images/titles/Title_NewsBox.jpg") 0px 0px no-repeat;
    }
    h4#NewsBox  span{
    visibility: hidden;
    }
    
    #divNewsBox {
    border: 0px solid red; 
    width: 237px;
    margin-left: 5px;
    background:url("../images/divNewsBox_bg.jpg") 0px bottom no-repeat;
    overflow: auto;
    }
    
    #ulNewsBox {
    border: 0px solid green;
    list-style-type: none;
    margin-top: 0px;
    margin-left: 0px;
    padding-bottom: 0px;
    background:url("../images/ulNewsBox_bg.jpg") 0px 0px repeat-y;
    }
    HTML:

    Code:
    <h4 id="NewsBox"><span>News Box</span></h4>
    <div id="divNewsBox">
    <ul id="ulNewsBox">
    <li><a href="#">News item</a></li>
    <li><a href="#">News item</a></li>
    <li><a href="#">News item</a></li>
    <li><a href="#">News item</a></li>
    <li><a href="#">News item</a></li>
    <li><a href="#">News item</a></li>
    <li><a href="#">News item</a></li>
    <li><a href="#">News item</a></li>
    
    </ul>
    
    </div>

    So far I havn't found a way to bridge this gap. And I'd hate to have to put the footer image in an new div container....

    Any thoughts?

  2. #2
    SitePoint Enthusiast S.Vasiliy's Avatar
    Join Date
    May 2006
    Posts
    73
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    add margin-bottom:17px; to your #ulNewsBox and it must fix the gap in ie

  3. #3
    SitePoint Addict
    Join Date
    Mar 2003
    Location
    Greenville, SC
    Posts
    388
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    *smacks forehead* thanks!


Bookmarks

Posting Permissions

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