Basel Compare CSS styling

Hi,

please find everything in Private content.

Thank you!

Best regards.

Hello,

I’d like to ask you again for the solution how is it possible to fix Basel Compare page display.

As I wrote you earlier some text from the products’ desciptions is justified, some is centered, I didn’t get why.

The code you provided fixed only the vertical-alignment (by the way I changed the property justify-content: start; in your code to justify-content: flex-start; because Custom CSS editor indicated a possible mistake).

So I used this code:

body .basel-compare-col {
text-align: center;
justify-content: flex-start;
}

I noticed that text-align: left; from your code also applied on the buttons TO THE CART and others, but I’d like to keep them centered. As well as everything in Compare-field (as it is differently displayed on mobile devices, the centered is fine to be there, too). That’s why I used text-align: center; in the code.

But Compare-value fields still need a solution for some uniform alignment. Can you check how it could be achieved?

Find the latest illustrating printscreen attached.

Best regards,

Hello,

thanks for getting back with a new code.
I’m sorry, but I don’t think it’s a proper solution to change the alignment in all descriptions of all of the shop’s products just to have them properly aligned in Compare page.

By the way in previous Basel versions (with YITH Compare plugin still used), the alignment of compared products was uniform. I mean that there was nothing like now when one paragraph is justified, another is centered. And if it used to be displayed fine then, I guess it is not the alignment of products’ descriptions to blame.

What’s interesting is the fact that in your printscreen our products’ descriptions in Compare page are aligned exactly how I’d like them to be (they are justified).
But if I add the same two products to Compare page, some of paragraphs are justified and some are centered (but they have the same property align=”justify” in the products’ descriptions). See my printscreen. I draw the arrows aside the paragraphs that should be aligned justified, but are centered. Be sure that I used to clear my browser cashe to get such result every time I tried.

Therefore my appeal remains the same – it would be great if in Compare page the products’ descriptions would remain aligned the same way as they are aligned in our products’ descriptions. As they are seen in your printscreen (not in mine). So how is it possible to achieve text-align: justify; in .compare-value?

Perhaps your code could make it happen with some modifications?

Best regards,

Hi,

yes, I just wanted to let you know that I tried to add your code and I got the same result as in your prinstscreen 🙂

This is exactly what I wanted to achieve. Products’ descriptions in Compare page now are aligned the same as in our shop.

So you provided a right solution. Thank you!

One more thing.
When I added the code in Custom CSS area in Theme Settings the CSS code editor showed me 3 remarks regarding some code lines. Please check if they need some adjustments:

1. -webkit-box-pack: flex-start;
Remarks:
expected (start) but found ‘flex-start’
the property -moz-box-pack should be included as well
the property -ms-box-pack should be included as well

2. -ms-flex-pack: flex-start;
Remark:
expected (start) but found ‘flex-start’

3. -webkit-box-align: start;
the property -moz-box-align should be included as well
the property -ms-box-align should be included as well

If the code should be tuned for better cross-browser compatibility, please let me know.

Thank you for your patient and kind assistance!

Hello,

OK, thank you one more time.

And what about that YITH WooCommerce Compare plugin now – should I disable, deactivate or delete it after it was changed by Basel Compare element? What do you suggest to do with it?

Also there’s one more plugin Simple Twitter Tweets ver. 3.2 from the initial Basel version we bought. Its new available version 4.4 wasn’t tested with recent WordPress versions and was updated 3 years ago. So should it be updated from 3.2 to 4.4. and continue being kept activated and enabled along with Basel theme?

Best regards,