Return to previous page

Ho do i make a round color circle around the icon in mobile penel

This topic has 8 replies, 3 voices, and was last updated 2 years ago ago by Tony Rodriguez

Kazi Sabit

Participant

October 24, 2022 at 12:46

Ho do i make a round color circle around the icon in mobile panel. Like this ?

https://prnt.sc/x1pahvDdaRwm

#337213 Copied Theme version: 8.5

7 Answers
Rose Tyler

Support staff

October 24, 2022 at 13:04
Hello,

Custom CSS can be used, for example – https://prnt.sc/Erm4CM8CpqAX
```
.et_b_mobile-panel-shop a {
    padding: 9px;
    background-color: red;
    border-radius: 100px;
    color: white;
}
```
Regards
#337216 Copied
Kazi Sabit

Participant

October 25, 2022 at 17:44

The circle is egg shaped https://prnt.sc/kfwdIRPBxwpo

#337324 Copied

Rose Tyler

Support staff

October 25, 2022 at 22:40

Add this code also:
.et_b_mobile-panel-shop .et_b-icon+span {
display: none !important;
}
> https://prnt.sc/1g3XvrnidZMa

Regards

#337334 Copied

Kazi Sabit

Participant

October 26, 2022 at 03:04

If i add this, text is gone. Can i make it round with text? And if i want to make the same thing with the cart button should i just replace shop (with cart)

#337341 Copied
Tony Rodriguez

Support staff

October 26, 2022 at 06:25
Hello, @Kazi Sabit,

Unfortunately, this is not possible to make it as round with the content as because it has a small space, let me try to explain it to you, If you set the border-radius to the maximum value as 100% in the very first code that we gave you, it will work like this: https://postimg.cc/Kk4X2xkW because that code will apply on the complete div having that icon and content under it, so because of the small space in the mobile it will not be round, but oval, If you want to check the size then you can try to change the padding value in that code as per your requirements: https://postimg.cc/2bJ5pH64

And regarding applying that same code on the cart, you have to pick the cart class in the code, and the code will be: https://postimg.cc/LgB3QZ4F https://postimg.cc/rzP4cJbZ
```
.et_b_mobile-panel-cart a {
    padding: 9px;
    background-color: red;
    border-radius: 100%;
    color: white;
}
```
Regards 8Themes Team.
#337346 Copied
Kazi Sabit

Participant

October 26, 2022 at 06:48

Ok

#337348 Copied

Tony Rodriguez

Support staff

October 26, 2022 at 07:06

Hello, @Kazi Sabit,

Thanks for your understanding and for contacting us.
Feel Free to generate a new topic, for the new issues, we are always here to help you, Thanks for contacting us.

Have a great day 🙂

Topic Closed.
Regards 8Themes Team.

#337349 Copied
Tagged: best selling, circle, color, icon, mobile penel, themes, woocommerce
Viewing 8 results - 1 through 8 (of 8 total)

The issue related to '‘Ho do i make a round color circle around the icon in mobile penel’' has been successfully resolved, and the topic is now closed for further responses

Ho do i make a round color circle around the icon in mobile penel

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection