Changing of Layout of Item Box

Hi ,
I would like to change a lay out of Product list   Item-box for a different resolutions , as I can see there some of them : 480 , 768, 980 , and mobile-only

I get it that I can put some code in CSS related to different sizes like 480.css or  mobile-only.css

I have written in  480.css  some thing like :

/* CATEGORY PAGE & GRIDS */

    .product-grid .item-box {
        width: 50%;
        float: left;
        margin: 0;
    }

But it's not working for me.
Would you mind to point me in the right direction , where to start.

Thank you.
Alex

Hi,

so you are trying to make the design of the item box in "defaultviewmode: list" for mobile devices be the same as in desktop ?

Best Regards!

[quote]Hi,

so you are trying to make the design of the item box in "defaultviewmode: list" for mobile devices be the same as in desktop ?

Best Regards![/quote]

Hi.
Not exactly, Here I'm trying to set Description layout to "left" , rather then "center" as on template.

I have set "default view mode to:  List " , and I have list all the way down to the mobile device, which is not what I looking for. So I'm trying to move image on top of item box ,when theme displayed on  mobile device, but it's not working for me yet, on a small (mobile screen ) item image still on the left and prices box and buy button getting squashed somehow on the right edge.

Regards.
Alex

Hi ALEX_,

I am not sure that I understand you correctly. Currently if you see the products in list on our demo the image is on the left and the description is on the right of the image. When you see the same page on small mobile device (click on the iPhone image on the top of the page) the products are displayed one on a line and the image is on the top(as you want I guess) and the description is below the image.

If you can send some screenshots to our support email on how you want to customize the item-boxes it will be best, so that we can get a better understanding.

Looking forward to your reply!

Best Regards!