Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Applying padding to a lightbox slideshow, but not other lightboxes


Toby7

Question

On a page I'm designing, I need to move the images in a lightbox slideshow over to the right to make room for their captions (which I'm putting in a column to the left). I use:

.yui3-lightbox2 .sqs-lightbox-slideshow .sqs-lightbox-padder {
    position: absolute;
    top: 0%;
    left: calc(100vw - 100vh - 150px);
    bottom: 0%;
    right: 0%;
}

But this also moves other single images that have their own lightbox view on other parts of the page, which I'd prefer to leave with the default setup. Is there a way I can restrict the above CSS to only apply to lightbox slideshows/galleries or to that particular one, rather than to all lightboxes? There is only one gallery on the page, but several individual images that have lightbox views.

I'd be happy to either solve this properly by getting the code to refer only to lightbox views for items in galleries, or to do it via ids, but I don't know how to do either.

Link to post
  • Answers 5
  • Created
  • Last Reply

Top Posters For This Question

5 answers to this question

Recommended Posts

  • 0

tuanphan, did you get my URL and password?

I'd love to know what to do about this. I think it all boils down to whether there is a way to use CSS to talk to the slideshow lightbox padder without talking to the single image lighbox one. If anyone has any ideas, I'd be very interested.

Link to post
  • 0

Thanks for sorting this out via email tuanphan. For others, the answer was to use write some additional CSS that only applies to light-boxes that aren't part of a slide show through use of :only-child

.sqs-lightbox-slideshow .sqs-gallery-design-stacked-slide:only-child .sqs-lightbox-padder {
    position: absolute;
    top: 0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
}

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...