SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Wizard johntabita's Avatar
    Join Date
    Mar 2001
    Location
    In a big, big house, with lotsa lotsa room
    Posts
    1,062
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)

    Gap in sliced images

    I'm having a problem getting the images in a sliced table to butt together properly. The problem occurs in IE 4 & 5 and NN6. (It's actually working properly in NN4 for once!)

    http://www.creative-edg.com/udc/master_page.html

    There is a gap just under each rounded corner at the top left and right, causing the purple bkgd to show. I've tried everything I know to do. Any help would be appreciated.

    Thanks!

  2. #2
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    john...

    In this row (line 21):

    <tr bgcolor="#FF7900">
    <td align="left" valign="top" width="9" height="12"><img src="images/corner_toplt.gif" width="9" height="12"></td>
    <td width="103"></td>
    <td bgcolor="#FF7900"></td>
    <td align="right" valign="top" width="9"><img src="images/corner_toprt.gif" width="9" height="12"></td>
    </tr>

    Just remove the &nbsp from each TD tag. They are what is setting off your layout. It would be better to use an image or better still nothing. YOu are already setting the height of the row by the height of the image, PLUS, if you set the color in the TR tag instead of the TD tag the color will stay in EACH cell regardless of whether it has content or not.

    You can see what I mean right here:
    http://www.gravitydigital.com/misc_uploads/cap.gif
    Last edited by creole; Jun 6, 2001 at 09:55.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  3. #3
    SitePoint Wizard silver trophy Jeremy W.'s Avatar
    Join Date
    Jun 2001
    Location
    Toronto, Canada
    Posts
    9,123
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Another thought (though this is bang on) would be to have your orange as a <td background="images/orange.jpg"> which would also alleviate it.

    Other thought is that your bottom right hand table rounding image is in the wrong cell.
    SVP Marketing, SoCast SRM
    Personal blog: Strategerize
    Twitter: @jeremywright

  4. #4
    SitePoint Wizard johntabita's Avatar
    Join Date
    Mar 2001
    Location
    In a big, big house, with lotsa lotsa room
    Posts
    1,062
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    Creole, your advise worked like a charm. Thanks a million!

    ...your bottom right hand table rounding image is in the wrong cell.
    Yes, I did notice that, studiococo. Thanks for pointing it out.

    Actually, the image is in the correct cell & the cell is set to align="right" valign="bottom" For some reason the image is shifting to the left, but only on a PC; it's fine on my Mac.

  5. #5
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    john, glad to help. A note, if you have a tight alignment such as the corner images, you really don't need the valign and the align on them as the only thing in the cell/row is the image.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  6. #6
    SitePoint Wizard johntabita's Avatar
    Join Date
    Mar 2001
    Location
    In a big, big house, with lotsa lotsa room
    Posts
    1,062
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    ...if you have a tight alignment such as the corner images, you really don't need the valign and the align on them...
    I'm in the habit of doing so "just in case", but you're right, it does make for extra code.

    After applying your fix to my problem posted above, I tested my page in Netscape and found out that it drops the bg cell color when the cell has no content.

    I added a "Netscape-only" tag that solves the problem:
    <td><spacer type="block" width="609" height="12"></td>

    Netscape recognizes it as content and IE ignores it nicely.

    Thanks again!


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
  •