How can I move a link to a new line on my cart page?

Topic summary

A user wants to move the “Continue Shopping” link below the “Your Cart” heading on their cart page, as both elements currently appear on the same line.

Two solutions were provided:

  1. CSS approach: Add custom CSS to the base.css file that changes the .title-wrapper-with-link class to use flexbox with column direction and center alignment, adding bottom margin to the title element.

  2. JavaScript approach: Insert custom <style> code in the theme.liquid file above the </body> tag to modify the layout structure.

Both solutions target the same CSS class (.title-wrapper-with-link) to stack the elements vertically instead of horizontally. The discussion includes code snippets and step-by-step instructions for implementing either fix in the Shopify theme editor.

Summarized with AI on November 19. AI used: claude-sonnet-4-5-20250929.

Hello wonderful community,

Thanks in advance for always giving me good solutions on a very timely basis.

In my cart page on the main heading there are two elements. They are both located on the same line.

  1. Heading - Your Cart

  2. A Link - Continue Shopping

I want to know how to change the 2nd element - the link - Continue Shopping to a line below the Heading - Your Cart. Please let me know what code I can use. Sharing the link to the page below:

https://gomyld.com/cart

1 Like

Hello There,

  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:
.title-wrapper-with-link {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.title-wrapper-with-link .title {
  margin-bottom: 10px;
}

Hey @hitesh469

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above tag.

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like