SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast Kisan's Avatar
    Join Date
    Jun 2003
    Location
    India
    Posts
    95
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Is this 3px IE problem?

    Please check this url and my css

    There is a small gap between the navigation on the laft and the image on the right which is not seen in FF/Opera.

    BTW I using Mouseover images with CSS by Ove Klykken

    Thanks in advance.

    kisan

  2. #2
    SitePoint Evangelist gollux's Avatar
    Join Date
    Feb 2005
    Location
    Oregon, USA
    Posts
    414
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Yep, the usual suspects... Hope IE7 is better?

    Holly Hack it as follows for proper display in IE6. Note the additions with the "Hide from IE5-Mac" pseudo comment. These serve to force a height and since you hare using a very tight design, throw in a -3 px right-margin and a reduced left margin where needed to get the header picture to stick against your menu sidebar.

    Code:
    body {margin:0;padding:0;}
    #top{margin:0;padding:0;width:741px;background-color:#666249;border-bottom:1px solid #fff;height:8px;line-height:8px;}
    #header{margin-left:179px;padding:0;background: url(../SampleDesignTest_files/header2.jpg) no-repeat top;width:562px;height:139px;}
    /* Hide from IE5-mac \*/ * html #header {margin-left:176px;} /* End hide from IE5-mac */
    #bot{clear:both;_clear:both;margin:0;padding:0;width:741px;background-color:#2f3571;border-top:1px solid #fff;height:8px;line-height:7px;}
    #topcontent{margin:0;padding:0;width:179px;float:left;}
    /* Hide from IE5-mac \*/ * html #topcontent {height: 1%; margin-right: -3px;} /* End hide from IE5-mac */
    .cssnav	{position:relative;font:bold .75em arial,verdana,helvetica, sans-serif;background: url(../SampleDesignTest_files/nav_bck_on.gif) no-repeat;display:block;width: 179px;height: 28px;color:#fff;}
    .cssnav a {display:block;font-size: 11px;width: 179px;height: 28px;float: left;margin: 0;padding: 0;color:#fff; text-decoration: none; }
    .cssnav img {width: 100%;height:100%;border: 0;}
    * html a:hover {visibility:visible;}
    .cssnav a:hover img{visibility:hidden;}
    .cssnav span {position:absolute;left:15px;top:5px;margin:0;cursor: pointer;}
    #sidenav{margin:0;padding:0;background-color:#e0e0db;width:178px;clear:both;float:left;}
    /* Hide from IE5-mac \*/ * html #sidenav {height: 1%; margin-right: -3px;} /* End hide from IE5-mac */
    #footer{background-color:#666249;font:bold .75em arial,verdana,helvetica, sans-serif;margin:0;padding:4px 0 0 10px;color:#fff;height:1.8em;width:741px;clear:both;}
    #middle{padding:0;width:741px;clear:both;}
    Last edited by gollux; Mar 6, 2005 at 00:57.
    Released under the Fiasco Labs Digital Damnation Copywright,
    it's yours to make whatever the 7734 you want with it.

    (c) 2005 Fiasco Labs All Wrongs Reserved

  3. #3
    SitePoint Guru DocType's Avatar
    Join Date
    Feb 2005
    Posts
    827
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yep, that looks like the IE 3px jog.

    You've got 3 stray lower case a's under the pic too.

  4. #4
    SitePoint Enthusiast Kisan's Avatar
    Join Date
    Jun 2003
    Location
    India
    Posts
    95
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile

    Thanks a ton gollux. You gave me a perfect solution.

    kisan


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
  •