[mikerayjonesParticipant]

Generally on my site louder.city, the horrible Google font “Wire One” that my client wants me to use is causing layout problems. In particular, in most text fields it generates too much top and bottom padding – for example, put anything in the basket and go to the checkout page: all the address text fields have too much white space, they should be the same depth as the “Country” field.

Is there any global way to fix this?

Thanks.

[ThaiModerator]

Hi There,

Thanks for writing in!

Try adding following CSS under Customize > Custom > CSS:

.woocommerce-checkout input {
    padding-left: 8px;
    height: 43px;
}
.woocommerce-checkout textarea {
    padding-left: 8px;
}

Hope it helps.

[mikerayjonesParticipant]

Fantastic, thank you – and what a fabulous response time from you guys (on a Sunday!)

There are a few more places where I have the same problem, as follows:

Search in sidebar;
Quantity & Coupon code on http://louder.city/cart/;
Default sorting & “Showing all x results” on http://louder.city/shop/.

If you could give me similar code for those areas too I would be very grateful.

Mike.

[ThaiModerator]

Hi There,

Please update the previous CSS a bit:

.woocommerce input,
.woocommerce select {
    padding-left: 8px;
    height: 43px;
}
.woocommerce textarea {
    padding-left: 8px;
}
#s {
    height: 43px;
}
.woocommerce-ordering .orderby,
 {
    padding-left: 8px;
    padding-top: 6px;
    height: 43px;
}
.woocommerce-result-count {
    height: 43px;
    line-height: 43px;
}

Hope it helps 🙂

[mikerayjonesParticipant]

Huge thanks again. The only one that needs a bit of tweaking is the Orderby, which is just clipping the bottom edge of the text. I tried adjusting the height but that didn’t seem to help…

Mike.

[ThaiModerator]

Hi There,

Try adding following CSS:

.woocommerce-ordering .orderby {
    font-size: 20px;
    padding-top: 8px;
}

Let us know how it goes!

[mikerayjonesParticipant]

Excellent, thank you. I had to adjust slightly as follows:

.woocommerce-ordering .orderby
{
font-size: 20px !important;
padding-top: 8px;
}

… and all’s well.

Thanks again for the great support.

[RupokMember]

You are welcome Mike!

Glad that it helped. Feel free to let us know if you face any other issue. We’ll be happy to assist you.

Thanks for using X.

Cheers!

[Author]

Posts