Docs

[isearchlocal]

hi guys,

i have looked through the whole forum and tried some CSS but it’s not working.

basically i want to change the behaviour of the collapsed site.

#1 instead of it collapsing from left to right (column1 on top of column2) i need it to collapse right to left.
so on a desktop they are as normal however when the site collapses and the columns slide on top of each other the right hand column needs to be the top column and then the left slide underneath, basically swapping around the standard behaviour.

#2 i would like to change the break point of this collapse also please.

thank you in advance guys.

[Nico]

Hi There,

Thanks for writing in! Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

Thanks.

[isearchlocal]

This reply has been marked as private.

[Christian]

I see. Regretfully, there is no option to do that. You will need to create another row that is visible only on mobile. You will need to hide your first row on mobile too. Please see https://cloudup.com/cem93IyIecW (play in Firefox) to learn how to use the Hide Based on Screen Width feature.

Thanks.

[isearchlocal]

Thanks christian,

I have child theme installed, is there no way to change the functionality from the there at all?

I have an additional 60 pages to create and already have 100 on the site as is.
It will take forever to change all these around?

i appreciate it if it isn’t, but if you have any ideas i would be grateful!

Thank you

[Rad]

Hi there,

Please add this CSS to Admin > Appearance > Customizer > Custom > CSS

@media ( max-width: 767px ) {

.home #x-section-2 > .x-container {
display: -webkit-box;
    display: -moz-box;
    display: box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
}

.home #x-section-2 > .x-container .x-column:first-child {
    -webkit-box-ordinal-group: 2;
    -moz-box-ordinal-group: 2;
    box-ordinal-group: 2;
}
.home #x-section-2 > .x-container .x-column:last-child {
    -webkit-box-ordinal-group: 1;
    -moz-box-ordinal-group: 1;
    box-ordinal-group: 1;
}

}

Hope this helps.

[isearchlocal]

thanks for that, id didnt seem to have any affect though?
i also need to achieve this for all pages not just home.

[Jade]

Hi there,

Regretfully this isn’t a feature offered by X. It could be possible with custom development since you want to make the changes site wide, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities. Thanks for understanding. Take care!

[isearchlocal]

oh no, i though rad was nearly there

[Joao]

Hi There,

An alternative solution for your issue would be to create double sections with inverted content and display some of this sections just on mobile their pairs just on desktop screens. You can do all that inside cornerstone without CSS.

Hope that helps,

Joao

[Author]

Posts