Hello,
how can i vertical align the text (title, content, button) to the middle, please?
https://www.awesomescreenshot.com/image/59239490?key=f1181a6e25c7b68d1b9bc6406331d95d
Solved
SP Page Builder
Carousel Pro vertical align middle
Accepted answer
Marked as the solution
Gianluca Pantaleo Asked this
Sorry, I meant vertical align not horizontal. So I found this solution:
/* --- UNIVERSAL VERTICAL CENTER FOR CAROUSEL PRO --- */
/* 1. Forza la struttura gerarchica a trasmettere l'altezza della slide */
.carosello-pro-homepage .sppb-carousel-pro-inner-content,
.carosello-pro-homepage .sppb-carousel-pro-inner-content > div,
.carosello-pro-homepage .sppb-container {
height: 100% !important;
display: flex !important;
flex-direction: column;
}
/* 2. Rendi la riga un contenitore Flex centrato */
.carosello-pro-homepage .sppb-row {
display: flex !important;
align-items: center !important; /* Centra verticalmente */
justify-content: center !important;
height: 100% !important;
min-height: inherit;
float: none !important;
}
/* 3. Annulla i float di Bootstrap per le colonne interne */
.carosello-pro-homepage .sppb-row > div[class*="sppb-col-"] {
float: none !important;
display: block !important;
}
/* 4. Reset Responsivo per Mobile */
@media (max-width: 767px) {
.carosello-pro-homepage .sppb-row {
flex-direction: column !important; /* Incolonna gli elementi */
height: auto !important;
text-align: center; /* Opzionale: centra il testo su mobile */
}
.carosello-pro-homepage .sppb-carousel-pro-text {
margin-bottom: 30px; /* Spazio tra testo e immagine su mobile */
}
} 2 more replies
Mehtaz Afsana Borsha Staff
Hi
Thanks for contacting us. You can use this CSS in your custom.css file
.sppb-carousel-pro-text{
text-align: center;
}
-Regards.
Mehtaz Afsana Borsha Staff
Ok.
Glad to know that you have found the solution, and thanks for sharing it. You can now close this post by accepting the answer.
Log in to reply.