[starstuffParticipant]

Hey there.

I tried uncountable variations und read thousands of your topics but “like witched”.

I would like to remove the border-radius of the button/box.

It is the result box of woocommerce. I can make every styles but I cannot remove its border-radius.

.woocommerce-ordering .orderby { font-size: 14px; text-shadow: 1px 1px 0px #fffbf5; color: rgb(215, 202, 189) ; border-style: dashed; border-width: 3px; border-color: #D7CABD; background-color: transparent;

-webkit-border-radius: 0px!important;
-moz-border-radius: 0px!important;
border-radius: 0px!important;
}

The first part is working perfectly. But the border-radius is very resistent agains owerwriting?!

Thank you.

[starstuffParticipant]

This reply has been marked as private.

[starstuffParticipant]

Shop page screen shot

[starstuffParticipant]

I mean the box “Sort by name: Z to A….

[starstuffParticipant]

I mean the box “Sort by name: Z to A” ….

[John EzraMember]

Hi there,

Thanks for writing in! I’m having trouble finding that sort feature. Which page is it found on? Thanks!

[starstuffParticipant]

Hey thank you for writing.

The sorting box which I mean is on all archive pages of woocommerce.
e.g. the shop (categories page)

http://starstuffberlin.com/vc-woowidget/

or the products pages e.g.

http://starstuffberlin.com/produkt-kategorie/pumpy-pumphose/

It is always on the left top.

By the way the dropdown box to select a attribute (e.g. size or color) on the product page makes me similar trouble (http://starstuffberlin.com/shop-2/fruechtchen/ and please see attached image). It is rounded and has a white backgroundcolor. To clearly identify: On my product page it’s called “Größe” and in the white area you can see “Wähle eine Ausführung”.
Is it possible to make it dashed bordered and with a transparent background, too?

Best regards

[ChristopherModerator]

Hi there,

Please add the following code in Customize -> Custom -> CSS :

.woocommerce div.product .summary .variations select,.woocommerce .quantity input[type="number"] {
    border-style: dashed;
    border-width: 3px;
    border-color: #D7CABD;
    background-color: transparent;
}
form.woocommerce-ordering:focus {
    outline: none;
}

Hope it helps.

[starstuffParticipant]

Hi.

You are incredible. Yes of course. It always helps!

But there is a pretty thing which is maybe forgotten. The box is still rounded. I also asked how to remove the border-radius.

Thanks

[John EzraMember]

Hi there,

Thanks for updating the thread! There is already a border radius set to 0. It also appears correct on our end. This issue may be browser and OS specific. I’m windows 10 and on the latest Chrome, Firefox, Edge and Internet Explorer, it looks correct.

What OS and browser are you using? Thanks!

[Author]

Posts