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

Changing Lightbox opacity to solid white.


MrRiise

Question

Site URL: https://www.magnusriise.no/illustration

Hi, I'm trying to change the color behind the picture/illustration when using a light box, in my gallery. It doesn't look good when you can see the other illustrations in the background.

I found this code, that helped with the opacity: 

.yui3-lightbox2 .sqs-lightbox-overlay {
  opacity: 1 !important;
}
.gallery-lightbox-background {
    opacity: 1 !important;

}

It would look much better with solid white, so the white background in my illustration doesn't show. Anyone know what I can do?

Edited by MrRiise
Link to comment

8 answers to this question

Recommended Posts

  • 0
14 hours ago, MrRiise said:

Site URL: https://www.magnusriise.no/illustration

Hi, I'm trying to change the color behind the picture/illustration when using a light box, in my gallery. It doesn't look good when you can see the other illustrations in the background.

I found this code, that helped with the opacity: 

.yui3-lightbox2 .sqs-lightbox-overlay {
  opacity: 1 !important;
}
.gallery-lightbox-background {
    opacity: 1 !important;

}

It would look much better with solid white, so the white background in my illustration doesn't show. Anyone know what I can do?

Try this CSS

.yui3-lightbox2 .sqs-lightbox-overlay {
    background-color: white !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
On 7/25/2021 at 3:27 PM, MrRiise said:

Hi, thank you so much for helping me out. It works perfectly!

 

Do you need to solve these?

Site URL – https://www.magnusriise.no/

2. (Tablet – Header) Menu is cut into 2 lines.

https://www.magnusriise.no/

magnusriise.no-02-min.png

3. (Tablet – Commission) Increase text width?

https://www.magnusriise.no/commissions#/playing-arts/

https://www.magnusriise.no/commissions#/playing-arts/

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
On 7/27/2021 at 9:49 PM, MrRiise said:

Yes please! I only have a big screen, or my phone, so I didn't know it looked like this on a different screen. 

If you know what to do, I would appreciate the help! 🙂

Q2. Add to Design > Custom CSS

/* tablet menu one line */
@media screen and (max-width:900px) and (min-width:641px) {
nav.main-nav ul {
    white-space: nowrap;
}
nav.main-nav ul li {
    margin-right: 10px !important;
}
nav.main-nav ul li a {
    font-size: 13px !important;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
23 hours ago, MrRiise said:

Hi  @tuanphan Thank you so much for helping me again. It's much appreciated.

With comission page width, add this CSS

/* tablet commission page width */
@media screen and (max-width:900px) and (min-width:641px) {
div#page-5e983f92178eaa4130588d00 .span-4:nth-child(2) {
    width: 90%;
}
div#page-5e983f92178eaa4130588d00 .span-4 .spacer-block {
    display: none;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment

Create an account or sign in to comment

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

×
×
  • Create New...