Solved

Adding border to columns in Dawn theme?

legalco
Visitor
2 0 0

I am using the Dawn theme and would like to add a border just around the the columns in my multicolumn sections. I know I can add a border to content containers but I don't want all content to have the borders. I'd like the border to only surround my columns in multicolumn sections. 

 

Thanks!

Accepted Solution (1)
made4Uo
Shopify Partner
3804 713 1124

This is an accepted solution.

Hi @legalco,

 

Please replace the code provided with the code below

.multicolumn-list__item.grid__item {
    border: 3px solid black;
}
Volunteering to assist you!  Likes and Accept as Solution  is highly appreciated.✌
Coffee fuels my dedication. If helpful, a small Coffee Tip would be greatly appreciated.
Need EXPERIENCED Shopify developer without breaking the bank?
Hire us at Made4Uo.com for quick replies.
Stay in control and maintain your security by avoiding unnecessary store access!

View solution in original post

Replies 6 (6)

made4Uo
Shopify Partner
3804 713 1124

Hi @legalco,

 

If you mean to have the columns bordered like below.

made4Uo_0-1679880398148.png

 

1. From your Admin page, go to Online store > Themes > click the three dots > Edit code
2. Find the Asset folder, and open the base.css file
3. Add the code below at the very end of the file

.multicolumn-card__info {
    border: 3px solid black;
}

 

Volunteering to assist you!  Likes and Accept as Solution  is highly appreciated.✌
Coffee fuels my dedication. If helpful, a small Coffee Tip would be greatly appreciated.
Need EXPERIENCED Shopify developer without breaking the bank?
Hire us at Made4Uo.com for quick replies.
Stay in control and maintain your security by avoiding unnecessary store access!
legalco
Visitor
2 0 0

Thank you! This is really helpful and almost perfect. This did create the border but the image portion of the column is above the border. The text is within the border. Any chance it's possible to have the border around both the text and image of the column?

 

made4Uo
Shopify Partner
3804 713 1124

This is an accepted solution.

Hi @legalco,

 

Please replace the code provided with the code below

.multicolumn-list__item.grid__item {
    border: 3px solid black;
}
Volunteering to assist you!  Likes and Accept as Solution  is highly appreciated.✌
Coffee fuels my dedication. If helpful, a small Coffee Tip would be greatly appreciated.
Need EXPERIENCED Shopify developer without breaking the bank?
Hire us at Made4Uo.com for quick replies.
Stay in control and maintain your security by avoiding unnecessary store access!
ogSarim
Visitor
1 0 0

Hey,

 

Can you move the borders up and down? Say I want to keep the title outside of the border and only the text inside, can I do that?

PageFly-Victor
Shopify Partner
7865 1785 3050

Hi @legalco 

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

 

Online Store ->Theme ->Edit code

Assets ->Base.css

.multicolumn-card__info>:nth-child(2) {
    border: 1px solid black;
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

GemPages
Shopify Partner
5588 1261 1203

Hello @legalco ,

 

It's the GemPages Support Team and we are glad to assist you today!

 

I would like to give you the recommendation to support you so kindly follow the steps below:

 

1. Go to Online Store > Theme > Edit code of your current theme

GemPages_0-1679889928133.png


2. Open your theme.liquid theme file


3. Paste the below code before </head>

<style>
.multicolumn-card__info {
    border: 2px solid black;
}
</style>

 

Let us know how it works for you.

 

Best regards,
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center