Hello,

Sorry for the delay.
Please add these lines in your Custom Css box:

.portfolio-item.overlayed:hover .overlay .bg {
opacity: 1.0 !important;
}
.portfolio-item.overlayed .overlay .bg {
    opacity: 1.0 !important;
    -webkit-transition: all .3s ease-in-out !important;
    -moz-transition: all .3s ease-in-out !important;
    -ms-transition: all .3s ease-in-out !important;
    -o-transition: all .3s ease-in-out !important;
    transition: all .3s ease-in-out !important;
}

If the situation persists, add some valid wp credentials in a private reply. So i can give it a closer look.

Best regards!

Hi, I have a question about the text in the overlay hover, that sometimes the text would appear out of the box. Any solution to this issue?

The website is http://www.ausunfinance.com.au.

The issue happens under the achievement page. Thx

Hello,

@Freedonut, Please add his code into your Custom Css box in General Options:

.portfolio-item.overlayed h4 {
    font-size: 14px !important;
}

Change the font until you are satisfied with the result.

PS: For future questions, please open your own tickets!

Best regards!

• This reply was modified 6 years, 10 months ago by Mirela.

Hi,

Thx for the reply, though I’m not complain about the font size. What I’m saying is that sometimes for long address, instead of showing in two lines, it’ll be displaying out of the box. Like the image showing below.

Hello,

Add this code instead:

.portfolio-item.overlayed .overlay .center-bar {
    margin-left: 10px !important;
    width: 80% !important;
    top: 45px !important;
}

Result: https://postimg.cc/image/t4gvqkjqf/
Change the values to your wish.

Best regards!

Now that all the text are not in the right place, I still want text to be in the middle and center.

Hello,

Just change the values until you are satisfied with the result.

Best regards!

Also, when I switch to mobile view, the text is way off.

Hello,

For mobile screen, add this code instead:

@media (max-widht: 480px){
.portfolio-item.overlayed .overlay .center-bar {
    margin-left: 10px !important;
    width: 80% !important;
    top: 45px !important;
}}

Of course, you have to change the values again to your wish.

Best regards!