-
-
Hi,
How can I make the icon size set in “Service Small Icon” BIGGER?
Thank you!
Nick
-
Hello,
Please add this code into your Custom css box in General Options:
.services_small dt i { font-size: 38px !important; }
Change the value to your wish.
Best regards!
-
Hi Mihaila/Support Team,
Tahnks for your reply. But the icon size can’t bigger than 40pixel?
Also, I have a further question that how can I choose different color of circle border and circle itself in Service Small Icon? (Service Samll Icon only allows to choose one color at “With circle” in style.)
Thank you!
Nick
- This reply was modified 5 years, 11 months ago by Nick.
-
Hello,
Yes the icon size can be bigger than 40pixel, just change the font size to your wish. But you have to also edit the size of the container of the icon. Add the code below into your Custom css box in General Options:
.services_small dt { width: 50px; height: 50px; }
Through page options you can change the Icon color and Icon background color. To change the border color add the code below:
.services_small .wrapper { border: 1px solid #666; }
Let us know.
Best regards! -
Hi Medrit/support team,
If I follow your steps to edit the size of the container of the icon, seems I need to edit the size of the circle and the container of the circle too… Otherwise, size of the circle and its container won’t adjust automatically by editing the icon code itself.
I’m wondering if you could provide full code of the Service Small Icon shown in this theme (at Our Service section): https://codeless.co/tower/default/business-fullscreen-video-slider/#
Thank you so much!
Nick
-
Hello,
The services small icon element has a predefined style. In the elements options you can only change the style.
https://postimg.cc/image/6hu29vva5/
Below is the entire extended css related to the sevices small element. Add it into your Custom Css box in General Options:.services_small dt{ width:84px; height:84px; } .services_small dt .wrapper{ width:70px; height:70px; margin-top:7px; } .services_small .wrapper{ border-radius: 50%; border: 2px solid #666; -webkit-border-radius:50%; -moz-border-radius:50%; width: 40px; height: 40px; } .services_small dd{ margin-left:100px; } .services_small dt .wrapper i{ line-height:70px; font-size:40px; } .services_small dt{ height:90px; } .services_small .wrapper{ float:right; } .services_small dd{ margin-right:100px; margin-left:0 !important; }
Change the values to your wish.
Note: Please keep in mind that this type of customization is not part of support service. If you need to further customize theme css, i suggest you hire a designer.
Best regards!
-
You must be logged in to reply to this topic.