Narrative Theme: Adjusting swatches in 2 columns on mobile

Highlighted
Excursionist
20 0 7

Hi everyone,

 

 I'm trying to adjust the css code for my swatches, but couldn't find a real good solution. For my swatches I'm using Infinite Options, and I'm trying to work it out with this custom css, but every time I insert it, swatches shows in one column. without it, however it shows in various columns - 1st line is in 2 columns, 2nd in 3 columns, 3rd in 1 column, etc. It looks good on laptop, so I don't really want to change the outlook there. Help will be much appreciated.

0 Likes
Highlighted
Excursionist
20 0 7

The css I was trying to use is:

 

.one-half-column-left {
width:48%;
float:left;
}
.one-half-column-right {
width:48%;
float:right;
}
}
@media only screen and (max-width: 600px) {
.one-half-column-left, .one-half-column-right
  #infiniteoptions-container {
    padding: 0 10px;
    float: none;
    widht: 100%;
  }

 

 

 

0 Likes