Results 1 to 2 of 2

Thread: Facebox 1.1 not displaying correctly

  1. #1
    Join Date
    Mar 2008
    Location
    Greenville SC USA
    Posts
    29
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Default Facebox 1.1 not displaying correctly

    1) Script Title: Facebox 1.1

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...ebox/index.htm

    3) Describe problem: the facebox is stretched to 100% width rather than wrapped around image. Also, the gray border is tripled on the sides.

    Example: http://thenewdeep.com/art/photography.html

    I've used facebox before and never had a problem. It's almost as if the script is being called multiple times but I've checked my html files and my directory but I cannot located any problems.

    Any help would be greatly appreciated. Thanks!!

    ******SOLVED*******
    After playing with an updated version of Facebox, I got it to work properly. Thank you anyway. Mods can feel free to delete this thread.
    Last edited by CrystalSC; 04-11-2010 at 04:14 AM. Reason: PROBLEM SOLVED

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,167
    Thanks
    44
    Thanked 3,240 Times in 3,201 Posts
    Blog Entries
    12

    Default

    It does look like that. But it's just inheriting styles from other declarations in your stylesheet.

    I'm not sure if this will fix it in all, but in Firefox developer tools setting (additions highlighted):

    Code:
    #facebox .b {
      background:url(http://thenewdeep.com/facefiles/b.png);
      padding: 0;
    }
    and:

    Code:
    #facebox table {
      margin: auto;
      border-collapse: collapse;
      width: auto;
    }
    in facebox.css took care of it. So obviously it's something about your other styles, I think it's (highlighted and red from your styles.css file):

    Code:
    /* Tables */
    
    table {margin-bottom: 1.4em; width: 100%;}
    th {font-weight: bold;}
    thead th {background: #C3D9FF;}
    th,td,caption {padding: 4px 10px 4px 5px;}
    tr.even td {background: #F2F6FA;}
    tfoot {font-style: italic;}
    caption {background: #EEE;}
    So if my advice doesn't work for all, perhaps you can figure out another workaround based upon what's causing this. You can always set the styles in styles.css for a class of table and a class of td and add those calsses to the table(s) and td(s) that you actually want them to apply to, so that they won't apply to facebox's table and tds.

    In other browsers there may be other styles from your styles.css or your on page stylesheet that are messing up facebox. if so, those will have to be traced down and/or fixed in a similar manner as I have done with the table width and the td padding in facebox.css.
    - John
    ________________________

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

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
  •