Align to the Top and Bottom of a Column

I’m trying to get the headline to align to the top, and the button to align to the bottom in these columns on my homepage. Please help :slight_smile:

Hi,

To achieve that, you can try adding the code below in Cornerstone > CSS

.the-row2 h3.x-text-content-text-primary {
    min-height:84px;
}

.the-row2 span.x-text-content-text-subheadline {
    min-height:114px;
}

Hope that helps.

That worked perfectly.

With regards to these columns shifting into 2 columns as it scales down to mobile… I’m using the following:

@media (min-width: 481px) and (max-width: 1024px) {
#the-row .x-column {
width: 100%;
float: left;
margin-right: 4%;
}

#the-row2 .x-column {
width: 48%;
float: left;
margin-right: 4%;
}

#the-row .x-column:nth-child(2n) {
    margin-right: 0;
}

}

What do I need to alter to set the break point to be sooner. I need it to shift down to two columns on smaller desktop screens.

thanks!

Hi,

You can modify the value of 1024px in max-width: 1024px to be something like max-width: 1400px.

Thanks.

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