Solved

CSS not working on IOS

rogerjet
Excursionist
32 0 3

Hi

 

I have added some custom css to my base.css file to change the look of my collection list on the homepage.

I am using the current dawn theme 13.0.1 website is swaace.com.au

 

This is the outcome I want;

 

rogerjet_0-1712965539415.png

 

But on IOS the css seems to get ignored and it get the following;

 

rogerjet_1-1712965620173.png

Here is the code i have added.

 

/* added to move text to centre of collection list image */
.collection-list-wrapper .card__content {
    position: absolute;
    justify-content: flex-start;
    left: 5%;
    height: 100%;
    align-items: center;
    }
.collection-list-wrapper .card.card--standard.card--media {
    position: relative;
    overflow: hidden;
    }
.collection-list-wrapper h3.card__heading span.icon-wrap {
    display: none;
    }
.collection-list-wrapper h3.card__heading a {
    /*color: white;  use this to change color of the text*/
    font-size: 20px;  
    font-weight: bold;
    }

thanks for any ideas.

 

Accepted Solution (1)

AnneLuo
Shopify Partner
501 102 97

This is an accepted solution.

Hello, @rogerjet 

The code you added is not in the correct location.

Please remove your code from @ media (preferences reduced motion: no reference) and (hover: hover). Then place it outside.

 

AnneLuo_0-1712977172933.png

 

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to Email Me   Buy Me A Coffee

View solution in original post

Reply 1 (1)

AnneLuo
Shopify Partner
501 102 97

This is an accepted solution.

Hello, @rogerjet 

The code you added is not in the correct location.

Please remove your code from @ media (preferences reduced motion: no reference) and (hover: hover). Then place it outside.

 

AnneLuo_0-1712977172933.png

 

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to Email Me   Buy Me A Coffee