Results 1 to 6 of 6

Thread: Lightbox overlay problem - IE, Opera

  1. #1
    Join Date
    Sep 2008
    Location
    Bristol - UK
    Posts
    842
    Thanks
    32
    Thanked 132 Times in 131 Posts

    Default Lightbox overlay problem - IE, Opera

    1) Script Title: Lightbox

    2) Script URL (on DD):

    http://www.dynamicdrive.com/dynamici...box2/index.htm

    3) Describe problem:

    Note: I downloaded the script from Lokesh's website, but thought I'd just link it here because it would be easier.

    Basically, in IE and Opera, the overlay isn't covering the whole page, it's ok height wise, just not width. In firefox it does cover the whole page. I did look it up and it seems someone else had this problem before, but I tried the code in that post and it didn't seem to work =/.
    The one I'm looking at is the Ivyleaf Mountainboarding Centre, it's in the southwest, 2nd from the left (I'm aware the rest of the spots look weird, but I haven't finished yet obviously :P)

    In Ivyleaf, click on gallery, and then image1, 2 or 3, and you should see what I mean.


    Since there's too much code to put in here, I will provide a link:

    http://www.bombthehills.com/test/ridingspots-uk.html

    Hope you can help

    Jack

  2. #2
    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

    Generally that can be fixed by this style:

    Code:
    html, body {
    margin:0;
    padding:0;
    }
    Then if you want a margin or padding around your page, use a container division around all of your content and give the margin/padding to it.
    - John
    ________________________

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

  3. #3
    Join Date
    Sep 2008
    Location
    Bristol - UK
    Posts
    842
    Thanks
    32
    Thanked 132 Times in 131 Posts

    Default

    Hey, thanks for the reply, but atm I have:

    Code:
    #html, body {
    width:989px;
    padding: 0;
    background:#000;
    margin:0 auto;
    }
    And taking out the "auto" part in margin makes the page not centred =/

  4. #4
    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

    Apply it to your container division.

    As I said:

    Then if you want a margin or padding around your page, use a container division around all of your content and give the margin/padding to it.
    That's the proper way to center content anyway. You should never use margin:0 auto on the HTML or BODY tags.
    - John
    ________________________

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

  5. #5
    Join Date
    Sep 2008
    Location
    Bristol - UK
    Posts
    842
    Thanks
    32
    Thanked 132 Times in 131 Posts

    Default

    Ok, sorry for the late reply but I was a bit confused as to what to do. It is working now , I did what you said and changed the <body> to have a margin of 0 and a padding of 0. At first this didn't work after I added the new "wrapper" div, I had it set out like this:

    Code:
    #html, body {
    padding: 0;
    background:#000;
    margin:0;
    width:989px;
    }
    
    #wrapper{
    width:989px;
    margin:auto;
    padding:0;
    }
    }
    Then, after I removed the width from the body it worked again silly me... Just wanted to post this in case anyone else has this problem, thanks for the help.

  6. #6
    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

    Sorry, I could have been clearer. Glad you figured it out. There are a very limited number of things that can safely be used as styles for the html and body elements. This is due to a lack of standardization across browsers and DOCTYPEs as to what any styles applied to these elements might actually mean. The safest thing (in most cases) is to just zero out the margins and padding on them, use a container division for the page and apply any other styles that you might otherwise be tempted to use on the html or body elements to that container division.
    - 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
  •