Matthew
Matthew

Reputation: 2246

Can't add 20px of padding on bottom of Fancybox

I've spent several hours try to figure out this darn thing. If you go here, and click on the image, a Fancybox w/ red overlay successfully pops up. The problem is, when you scroll all the way down to the bottom, the Fancybox kisses the bottom of the browser, and there is no space. I want there to be space there!

I've tried to add bottom:20px; or padding: 0 0 20px 0; to the <div class="fancybox-wrap fancybox-desktop fancybox-type-image fancybox-opened"</div> class; but got ZIP!

I really appreciate your time, and unlike me, I hope you can find the solution.

P.S. — Sorry for the lack of a jsFiddle link. Fancybox doesn't play well w/ jsFiddle. ;(

Upvotes: 2

Views: 202

Answers (1)

display-name-is-missing
display-name-is-missing

Reputation: 4409

The solution is quite simple, just add this line of CSS to .fancybox-wrap fancybox-desktop fancybox-type-image fancybox-opened:

margin-bottom:20px;

The CSS you tried to add would only give more space inside of the div, not outside it, which margin on the other hand does.

Upvotes: 2

Related Questions