Remove borderline for Collage - Dawn Theme

Store Design
,

Topic summary

Goal: Remove the thin border around Collage blocks in the Shopify Dawn theme.

Key steps suggested:

  • Add custom CSS in theme.liquid (before ):
    • .collage-card { border: unset !important; }
  • Alternative approach in Assets > base.css:
    • .global-media-settings { border: none !important; }

Follow-up for multirow layouts:

  • Use the global selector solution (.global-media-settings) via theme.liquid to remove borders across multirow collage sections as well.

Context:

  • The requester shared store URLs (vsai.store, /pages/subjects, /pages/v01-yellowstone) so helpers could verify the issue.
  • Screenshots were provided; the core resolution relies on the CSS snippets above.

Outcome:

  • The requester confirmed the solution worked and expressed thanks.
  • No remaining open issues; thread effectively resolved.
Summarized with AI on December 28. AI used: gpt-5.
1

Hello,

Is there a way where I can remove the small line round this collage?

Skærmbillede 2024-05-30 kl. 10.39.52.png
Skærmbillede 2024-05-30 kl. 10.39.52.png1244×812 241 KB

Dear regards

//Rasmus

1 Like
2

Hello @RasmusUG

Can you share store URL?

3

Hello There,

Please share your store URL and password.
So that I will check and let you know the exact solution here.

4

https://vsai.store/

ponyplay

5

https://vsai.store/pages/subjects

1 Like
6

https://vsai.store/pages/subjects

7

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.collage-card { border: unset !important; }

techlyser_web_0-1717059801659.png
techlyser_web_0-1717059801659.png1246Ă—532 373 KB

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

1 Like
8

Ty so much!!

9

Hi @RasmusUG

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > base.css and paste this at the bottom of the file:
.global-media-settings {
    border: none!important;
}

ZestardTech_0-1717059956324.png
ZestardTech_0-1717059956324.png1685Ă—770 252 KB

1 Like
10

What if I want to do it with a multirow like here: https://vsai.store/pages/v01-yellowstone

11

Ty so much!

1 Like
12

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.global-media-settings { border: unset !important; }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

1 Like
13

Hi @RasmusUG

Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance. If helpful then please Like and Accept Solution.

1 Like