Featured Collection need help with Responsive CSS for Header and View All Button on Dawn Theme

Featured Collection need help with Responsive CSS for Header and View All Button on Dawn Theme

grantc00
Tourist
5 0 2

Screenshot 2024-02-01 at 11.33.48 PM.png

Screenshot 2024-02-01 at 11.34.03 PM.png

Hi everyone,

  1. Heading Issue: I've styled the heading of my feature collection section with a margin-left to align it properly on desktop screens. However, this causes the heading to be off-screen on mobile devices. CSS is also include on the screenshot.  I'd like the heading to remain in its desktop position on larger screens but also be fully visible and properly aligned on mobile screens.
  2. Button Issue: Additionally, the "View all" button seems to be pushed upwards on mobile screens, making it misaligned with other elements. This isn't the behavior I intended, and I'd like to correct it so that the button's position is consistent across all devices.

Could anyone guide me on how to make both these elements responsive? My goal is to ensure that the heading and the button are both visible and well-positioned on all devices without affecting the desktop layout.

 

Replies 2 (2)

Dan-From-Ryviu
Shopify Partner
8550 1687 1694

Hi @grantc00 

Could you share your store URL?

- Helpful? Like and Accept solution to let me know!>
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

grantc00
Tourist
5 0 2

5fe303-4.myshopify.com

pw: eumpoh