Results 1 to 4 of 4

Thread: Spaces in IE, but not in FF, Safari, etc.

  1. #1
    Join Date
    Feb 2007
    Posts
    46
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default Spaces in IE, but not in FF, Safari, etc.

    I hope this is something very simple to correct. The test page is here:

    http://www.makosmotorsports.com/schedule2.html

    Looks fine in FF (Windows) and Safari (Mac), but in IE I get a separation of components, creating transparent spaces where I don't want them. There are currently 2 spaces showing in IE.....The first is directly under the site masthead, and the second is under the "SCHEDULE" header, between the header and the actual table.


    Is there anything I can do to fix this? I can't really go on with this site until this is resolved. Many thanks in advance.

  2. #2
    Join Date
    May 2006
    Location
    Sydney, Australia - Near the coast.
    Posts
    1,995
    Thanks
    0
    Thanked 8 Times in 7 Posts

    Default

    I don't see any whitespace.

    But anyway, you can generally fix this by using the CSS property:
    Code:
    line-height:0;
    to the container that has the spacing problem.
    Peter - alotofstuffhere[dot]com - Email Me - Donate via PayPal - Got spare hardware? Donate 'em to me :) Just send me a PM.
    Currently: enjoying the early holidays :)
    Read before posting: FAQ | What you CAN'T do with JavaScript | Form Rules | Thread Title Naming Guide

  3. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Get rid of the white space in your source code here:

    Code:
    		<img src="/images/Banner2.jpg" width="800" height="84">
    		
    	<div style="border:none; background:transparent; padding-top:0px; padding-right:0px; padding-left:0px padding-bottom:0px; 
    		width:800px; height:550px; overflow:auto;">
    Like so:

    Code:
    <img src="/images/Banner2.jpg" width="800" height="84"><div style="border:none; background:transparent; padding-top:0px; padding-right:0px; padding-left:0px padding-bottom:0px; 
    		width:800px; height:550px; overflow:auto;">
    or style the image display:block -

    Code:
    <img style="display:block;" src="/images/Banner2.jpg" width="800" height="84">
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  4. #4
    Join Date
    Feb 2007
    Posts
    46
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    <img style="display:block;" src="/images/Banner2.jpg" width="800" height="84">

    THANK YOU !!!

    I added the style="display:block;" to the img tag, and that took care of the mysterious gap below the image that appears with IE.

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
  •