Vertical Align Content

Support
#1

Hi,

I’m using visual composer and am struggling to align the text in my homepage header section:

www.digitalassembly.agency

I can do it with padding and it looks great on my laptop but on other screen sizes/mobile it doesn’t stay balanced.

Thanks,

#2

Hi @dansancisco,

Please kind;y add the CSS code below to X > Theme Options > CSS

.home #x-content-band-2 {
    height: 100vh;
    display: flex;
    align-items: center;
}

The code above will work on;y for the Homepage of your website.

Thank you.

#3

Hi Chris,

Thanks. Is there a way to create a class that would allow me to do this across other elements when needed?

#4

Also, there content now doesn’t seem to be inside an inner container on mobile and isn’t centered on mobile either?

#5

Hi @dansancisco,

Sure, you can change it to this

.full-height {
    height: 100vh;
    display: flex;
    align-items: center;
}

Then simply add full-height to your preferred element’s Class input field.

Cheers!

#6

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.