Image Pixelation on Mobile (Image with Text Overlay)

Technical Q&A
1

I’m having an issue with the mobile hero image on my landing page looking pixelated when viewed on mobile, I believe the theme (Flow) is calling on the wrong size image to be loaded, could anyone please take a look and provide the necessary CSS to adjust media size? The URL is halfspaced.com

Thank you!

2

@Halfspaced ,

can you please provide screenshot

I will check out the issue and provide you a solution here.

3

IMG_3360.PNG
IMG_3360.PNG295×640 409 KB

4

@infoatcodelab7 When zooming in on a mobile device the hero image appears pixelated, yet the other images on the homepage do not, I’m also having an issue with all custom links being underlined, it seems like a theme issue, if you could look into this too it would be GREATLY appreciated!

5

Can you please send me store URL?

6

@DelightCart Halfspaced.com

7

I cant see that issue. See attachment.

8ef5a3f4-600e-45fc-a672-972104f0ad3d.jpg
8ef5a3f4-600e-45fc-a672-972104f0ad3d.jpg540×1200 43.5 KB

8

@DelightCart https://www.halfspaced.com/collections/outerwear All links when added to a text box are automatically being underlined, see menu items below the nav.

9

@Halfspaced ,

Please add this CSS to your theme

.rte a{
    border-bottom:none !important;
}

Thanks!

10

Go to assets/theme-collection.min.css

Find this class: .rte a

make border 1 px to 0 as below.

border-bottom: 0px solid:
11

@DelightCart @infoatcodelab7 Thanks both of you, they both work!