how can I make 2 column per row on Product Page on Mobile View

[kurtakaosku]

hi there

how can I make 2 column per row on Product Page on Mobile View ?

thanks

[Basara]

Hello.

You need to change "cols" in your bootstrap template files
https://github.com/abantecart/abantecart-src/blob/master/public_html/storefront/view/default/template/pages/product/product_listing.tpl#L38
https://github.com/abantecart/abantecart-src/blob/master/public_html/storefront/view/default/template/blocks/product_list.tpl#L40

https://www.w3schools.com/bootstrap/bootstrap_grid_examples.asp

[kurtakaosku]

hi Basara
Thanks for the reply

but what I mean is that the 2 colomn View in Mobile or Phone not in Desktop Mode

and the way you just gave is for desktop Mode

and my Question is what about for Mobile View ?

which "col" should I change the number ?

[Basara]

Please learn what is "bootstrap". You can also search forum your question was unswered before

[kurtakaosku]

hi Basara

I had succeded making 2 column in Mobile View by changing the "col-xs-" in

<div class="col-md-3 col-sm-6 col-xs-12">

into

<div class="col-md-3 col-sm-6 col-xs-6">

but the looking still not neat as seen on the attachment

can you please tell me if there is something wrong ?

the chart button on the left product column is crushed by the product on the right colomn then it is unseen
I think it has to do with left margin adjustment

Hope for your next help

[kurtakaosku]

hi Basara

I had succeded making 2 column in Mobile View by changing the "col-xs-" in

<div class="col-md-3 col-sm-6 col-xs-12">

into

<div class="col-md-3 col-sm-6 col-xs-6">

but the looking still not neat as seen on the attachment

can you please tell me if there is something wrong ?

the chart button on the left product column is crushed by the product on the right colomn then it is unseen
I think it has to do with left margin adjustment

Hope for your next help

hope anybody here help me about this

thanks before