Mobile size pics

Support
#1

I would like to reduce the size of a couple of pictures to fit into a 2 column row on mobile screens so instead of seeing one pic as here
there would be 2 smaller pics on one row (side by side). Is that possible and how would I do it?

Also the headline at top of page needs to be responsive

#2

Hi,

You can create another row with just 2 columns and then make it visible in mobile only.

After that, add this in the style field of your column element.

width: 48%!important;

Thanks

#3

i did that but the columns still stack on top of each other?

#4

Hello There,

Thanks for updating in! Well in that case, please edit the page back in Cornerstone and in the custom cs, you can add this code:

@media(max-width: 767px) and (min-width: 480px){
  .el24.x-column, .el26.x-column, 
  .el28.x-column, .el30.x-column {
    float: left;
    width: 48%;
    margin-right: 4%;
    margin-bottom: 4%;
  }

  .el26.x-column, .el30.x-column {
    margin-right: 0;
  }    
}

Hope this helps. Kindly let us know.