SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member WSD Student's Avatar
    Join Date
    Feb 2010
    Location
    South Yorkshire/United Kingdom
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Help needed with lightbox

    Hi all,

    I have used a lightbox on a website but it is not working correctly. When you click on an image it looks like it's adding padding or something to it.

    The link to the page is here
    http://www.test.gfemassage.co.uk/rooms.html

    Thanks
    Janice

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    That sounds odd, so let's check things out.

    Remove the lightbox script and the image padding still occurs. The lightbox is not causing the problem.

    When does the problem occur? Only when the mouse is held down on the image. As soon as you let go of the mouse, the padding returns to normal.
    Is it the styles? Remove the styles and the problem goes away. It's a CSS problem now.

    What can we chop away from the CSS that might quickly get us to the root cause of the problem. Active pseudo classes? Eureka! It's their styling causing the problem. Specifically, the following CSS declaration:

    Code css:
    #navigation li:last-child a:hover, a:active {
        background-color: #ddd;
        color: #2e2e2e;
        width: 80px;
        padding: 6px 31px;
    }
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Member WSD Student's Avatar
    Join Date
    Feb 2010
    Location
    South Yorkshire/United Kingdom
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank You


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
  •