Docs

[riwaro]

Hello,

How can I change the mobile view of the store basket. I would like the text to be left-aligned.

http://xyo.riwaro.de/warenkorb/

Also in the checkout I would like the text left-aligned. The fields for name etc. must also be adapted.

http://xyo.riwaro.de/kasse/

This is, as already mentioned, for the mobile view.

Thank you very much Thomas

[Paul R]

Hi Thomas,

Thanks for writing in! Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

[riwaro]

Hello,

How can I change the mobile view of the store basket. I would like the text to be left-aligned.

pic-1

Can you improve the mobile view?

pic-2

Many greetings Thomas

[riwaro]

How can I change the mobile view of the store basket. I would like the text to be left-aligned.

pic-1

Can you improve the mobile view?

pic-2

Many greetings Thomas

[Paul R]

Hi,

Thank you for providing screenshots.

You can add this under Custom > Edit Global CSS in the Customizer.

@media (max-width: 767px) {
body .entry-content .x-container.max.width {
    padding:0 10px;
}

.woocommerce-account form .form-row-first, 
.woocommerce-account form .form-row-last, 
.woocommerce-checkout form .form-row-first, 
.woocommerce-checkout form .form-row-last {
    float: none;
    width: 100%;
}
}

Hope that helps.

[riwaro]

Hello,

the checkout now looks much better. Thank you.

How can I change the view in the basket. The marked area should be left.

Greetings Thomas

Please look at the atteched pic

[Paul R]

Hi Thomas,

kindly change the code provided above that reads.

body .entry-content .x-container.max.width {
    padding:0 10px;
}

to this

body .entry-content .x-container.max.width {
    padding:0 10px !important;
}

the whole code should look like this.

@media (max-width: 767px) {
body .entry-content .x-container.max.width {
    padding:0 10px !important;
}

.woocommerce-account form .form-row-first, 
.woocommerce-account form .form-row-last, 
.woocommerce-checkout form .form-row-first, 
.woocommerce-checkout form .form-row-last {
    float: none;
    width: 100%;
}
}

Hope that helps.

[riwaro]

Thank you very much….

You really do a super job

Thomas

[Prasant Rai]

You are most welcome. 🙂

[Author]

Posts