How to put in the left align on the product page?

[VisarK]

Hello Community,hope all are good.I use Dawn theme and in my product page i want the product title,prices,shipping calculated at checkout, and the quantity with selector button to put in the left align.

 

[Made4uo-Ribe]

Hi @VisarK 

Check this one. 

1. From you Admin page, go to Online Store > Themes

1. Select the theme you want to edit
2. Under the Asset folder, open the main.css(base.css, style.css or theme.css)
3. Then place the code below at the very bottom of the file.

#shopify-section-template--22723455385903__main {
    text-align: left;
}
.product-form__input .form__label {
    text-align: left !important;
}
.product-form__input .quantity {
    margin-left: 0;
}

• And Save. 
• Result:
• 

[VisarK]

It doesnt work @Made4uo-Ribe 

[WizzCommerce_Co]

Hi @VisarK , You can follow my instruction below:

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: Click on theme.liquid and paste the code above the </head>

<style>
.product-card-wrapper .card__information {
    text-align: left !important;
}
.product-card-wrapper .card__heading, .product-card-wrapper .price {
    text-align: left !important;
}
.product-form__input .quantity {
    text-align: left !important;
}


</style>

If my answer is working for your store, please let me know by accepting Solution and giving Like !!!

[VisarK]

I tried but still doesnt work @WizzCommerce_Co 

[Made4uo-Ribe]

Please, check this one again. Thanks!

.product__title, .jdgm-preview-badge--with-link {
    text-align: left !important;
}
.product-form__quantity .form__label {
    text-align: left !important;
}
quantity-input.quantity {
    margin-left: 0 !important;
}

And Save. 

[VisarK]

I tried now doesnt work @Made4uo-Ribe .The word shipping calculated at checkout must be under prices on the left,and quantity also in the left so i tried with this but still is the same quantity in the center and shipping calculated at checkout right side 

[WizzCommerce_Co]

Hi @VisarK , thank you for posting here!

You can follow my instruction below:

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: Asset folder, open the base.css -> place the code below at the very bottom of the file.

#shopify-section-template--22723455385903__main {
    text-align: left;
}
.product-form__input .form__label {
    text-align: left !important;
}
.product-form__input .quantity {
    margin-left: 0;
}

If my answer is working for your store, please let me know by accepting Solution and giving Like !!!

[VisarK]

Doesnt work @WizzCommerce_Co 

[WizzCommerce_Co]

Hi @VisarK , You can follow my ANOTHER instruction below:

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: Click on theme.liquid and paste the code above the </head>

<style>
.product-card-wrapper .card__information {
    text-align: left !important;
}
.product-card-wrapper .card__heading, .product-card-wrapper .price {
    text-align: left !important;
}
.product-form__input .quantity {
    text-align: left !important;
}


</style>

If my answer is working for your store, please let me know by accepting Solution and giving Like !!!

[VisarK]

I tried also but still the same @WizzCommerce_Co 

[VisarK]

My store url is www.pawshubs.com

[BSSCommerce-TC]

Hi @VisarK ,

You can follow these steps

Step 1: Please navigate to Online store > Themes > Edit code and find base.css

Step 2: Insert code at the end file and Save them.

.product__title > h1 {
    text-align: left;
}

.product-form__quantity .form__label {
    text-align: left !important;
}

.product-form__input.product-form__quantity {
    display: grid;
    justify-content: flex-start;
}

It like that:

We're happy to see that our suggestion helped you solve the issue. Can you kindly give us a like and mark it as a solution? This can be a reference for other merchants if they have an issue like you.

Should you need any further information, please do not hesitate to contact us by tagging directly at Community post. We will check and let you know soon.

Thanks in advance.

[VisarK]

Hi @BSSCommerce-TC Shipping is like in photo,but must be under prices and in the left align also quantity isnt chang