%-counter in Cercle

dani3
Inactive member
Topic Author
New Member

2 years 3 months ago #49538 by dani3

%-counter in Cercle was created by dani3

Hi,

On the demo page the % are in the circle. I tried every setting, but I get them under the circle. This uses al lot of unnecessary space. How do I change that?

Daniel

Attachments:

Please Log in to join the conversation.

milos
Support Staff
Moderator

2 years 3 months ago #49539 by milos

Replied by milos on topic %-counter in Cercle

Hello,

There are no settings for this, but you can achieve this by adding custom CSS code in your template's CSS file:

Code:

.counter_number.percentage {
    position: relative;
    margin: 0;
    top: -155px;
}

Please adjust the value of -155px as appropriate for your website.

Regards,
Milos

Please Log in to join the conversation.

dani3
Inactive member
Topic Author
New Member

2 years 3 months ago #49540 by dani3

Replied by dani3 on topic %-counter in Cercle

Thanks. It looks good on a small desktop, but on a big screen or on mobile it gets in the counter.
I tried with % instead of px, but it doesn't work.
Any Ideas to align it for every screen?

Please Log in to join the conversation.

milos
Support Staff
Moderator

2 years 3 months ago #49542 by milos

Replied by milos on topic %-counter in Cercle

You can add specific value to mobiles using media queries. For example, the second value (250px) will be for mobile screens. Please change the top values as appropriate.

Code:

.counter_number.percentage {
    position: relative;
    margin: 0;
    top: -155px;
}

@media (max-width: 767px) {
  .counter_number.percentage {
    top: -250px;
  }
}

Regards,
Milos

Please Log in to join the conversation.

Time to create page: 0.223 seconds