Hey!
i would like to know if possible to arrange the colums to be in line instead of big view one under the other in mobile view
Screenshot mobile view: http://prntscr.com/jqurqr
Screenshot Normal view: http://prntscr.com/jqus4h
The colums in mobile view are so big. cant they be arrange to small pics in a line like in the normal view in corner stone?
Hi There,
Thank you for writing in, Please add this to Theme Options > CSS
@media(max-width: 979px){
.stay-inline .x-column.x-sm.x-1-4 {
width: 22%;
float: left;
margin-right: 4%;
}
.stay-inline .x-column.x-sm.x-1-4:last-of-type {
margin-right: 0;
}
}
Then apply the CLASS stay-inline to your section (where the logos are), as long as your section has that stay-inline class, your 1/4 columns will stay inline even on mobile view.
Hope it helps,
Cheers!
Hey friech!
Thank you for your reply!
thought that i have 1/6 colums and 1/2 and 1/3 and 1/4 and 1/5. not all just 1/4
i have tried what you told me and there was no results.
however i have added a Video so you could see what i did:
See the Video>> https://www.youtube.com/watch?v=rRGXxmSMsR4&feature=youtu.be
Hi There,
Thanks for writing in!
Sorry for the confusion!
The theme is responsive to behavior, which means it will adapt any size of the device. Changing the responsive behavior may cause damage to other section.
The CSS given by @friech is for 4 column layout. if it is not working plz try this
@media (max-width: 767px) {
.stay-inline .x-column.x-sm.x-1-4 {
width: 22%;
float: left;
margin-right: 4%;
}
.stay-inline .x-column.x-sm.x-1-4:last-of-type {
margin-right: 0;
}
/* for five column layout*/
.stay-inline .x-column.x-sm.x-1-5 {
width: 16.8%;
float: left;
margin-right: 4%;
}
.stay-inline .x-column.x-sm.x-1-5:last-of-type {
margin-right: 0;
}
}
You can find more info on how to check for CSS selectors here.
Then information about writing your custom CSS here.
Hope this helps!
and for 6 colums?
you provided me codes for 4 colums and 5, could you please provide me also for 2,3,6 colums as well?
Hello There,
You may update the codes into this:
@media (max-width: 767px) {
/* for two column layout*/
.stay-inline .x-column.x-sm.x-1-2 {
width: 48%;
float: left;
margin-right: 4%;
}
.stay-inline .x-column.x-sm.x-1-2:last-of-type {
margin-right: 0;
}
/* for three column layout*/
.stay-inline .x-column.x-sm.x-1-3 {
width: 30.666%;
float: left;
margin-right: 4%;
}
.stay-inline .x-column.x-sm.x-1-3:last-of-type {
margin-right: 0;
}
/* for four column layout*/
.stay-inline .x-column.x-sm.x-1-4 {
width: 22%;
float: left;
margin-right: 4%;
}
.stay-inline .x-column.x-sm.x-1-4:last-of-type {
margin-right: 0;
}
/* for five column layout*/
.stay-inline .x-column.x-sm.x-1-5 {
width: 16.8%;
float: left;
margin-right: 4%;
}
.stay-inline .x-column.x-sm.x-1-5:last-of-type {
margin-right: 0;
}
/* for six column layout*/
.stay-inline .x-column.x-sm.x-1-6 {
width: 13.333%;
float: left;
margin-right: 4%;
}
.stay-inline .x-column.x-sm.x-1-6:last-of-type {
margin-right: 0;
}
}
Please understand that 6 columns may not properly supported since the section has only 5 columns by default.
Hope this helps.
Great! much thanks!
Just one question. on my second section in homepage called homepage the first frame on aligned to the left… and i want it to be in the middle.
how can i align it to middle i have tried to align middle in corner stone it does not help
i actualy want everything to be aligned to the middle
screenshot>>
Hi Adam,
You can try adding setting three columns to the first section then add the content to the middle column.
Hope this helps.
but i do have three colums, there should be the arrows gifs pointing at the middle photo
Hi,
You need to remove x-hide-sm class to your image element. It is hiding it in mobile.
See screenshot
Check visibility settings of your image element.
Thanks
Oh ok! Thanks! 
You’re welcome, Cheers!
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.