Optimizing collection text area width for PC and Mobile users

New Member
9 0 0

Hello,

 

I tried to increase collection text area width so it doesn't look it's "stacked" and text will spread to right. I edited this on assets folder:

 

.medium-up--grid--table {
display: table;
table-layout: fixed;
width: 100%;
margin-left: 0;

 

Instead of 100% I used 200%. It did spread perfectly on PC and was just what I was looking for. However when visiting my page with mobile phone, it will show only like 50% of the text. Any ideas how to do this in some other way so the text will spread to the right and still be optimized for phone users?

 

Store is set to public already:  www.timmspc.fi

 

Here's picture to demonstrate:

image.png

0 Likes
Shopify Partner
197 23 20

@timmspc

 

Add following css into your theme.scss.css file:

.template-collection header .section-header__item {
    width: 100%;
}

Let me know still you need more help.

 

Thank you,

Tejas

 

 

 

Shopify Expert | email: support@hexaecommerce.com | Skype: tejas.nadpara
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
0 Likes
Highlighted
New Member
9 0 0

Perfect this worked, thanks!

0 Likes