(Dawn) How to move description text to the same line as heading

[friendlyrobot19]

Is it possible to move the description to align and mirror the heading?

The following is how I would like it to look:

How it currently is:

Store link: https://95d536-88.myshopify.com/         

Store keycode: www

 

[Huptech-Web]

Hello @friendlyrobot19, It is possible to create this kind of design by simply inserting a small snippet of code into your custom.css file or wherever you compile all your CSS, such as the example given below:-

.collection__title.title-wrapper {
    margin-bottom: 2.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

Furthermore, the screenshot has been provided for your convenience.

Feel free to reach out if you have any additional questions. If this solution is helpful, please consider liking and accepting it.
S.P

[BSSCommerce-HDL]

Hi @friendlyrobot19, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag: 

<style>
.collection__title.title-wrapper {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
}
</style>

Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you  😍

[niraj_patel]

Hello @friendlyrobot19 

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 </body> on theme.liquid
<style>
  .collection__title.title-wrapper{
      display: flex;
      justify-content: space-between;
      align-items: center;
   }
</style>

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

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @friendlyrobot19 
- Please follow these steps:

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

.collection__title.title-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

- Here is the result you will achieve:

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.