Bootstrap circle not round

Question

I can't figure out what to do with the style, for it to display a really round circle instead of the elongated one.

Pretty new to HTML and bootstrap, don't rage at me.

<span data-mdb-toggle="tooltip" title="unread" class="badge rounded-pill bg-info" style="cursor: default"> </span>

Remove the , this creates a character which increase height to the container. — Salketer, Aug 10 '22 at 12:01
If you use a div instead? Or at least an inline-block? Hard to say without any reproduction... — Salketer, Aug 10 '22 at 12:06

MOHAMAD FAHRI KURNIAWAN · Accepted Answer · 2022-08-10T12:43:48.200

-1

you need to add the same width and height, so you get a completely round circle.

edited Aug 10 '22 at 12:43

answered Aug 10 '22 at 12:38

[Please don't post screenshots of text](https://meta.stackoverflow.com/a/285557/354577). They can't be searched or copied, or even consumed by users of adaptive technologies like screen readers. Instead, paste the code as text directly into your question. If you select it and click the `{}` button or Ctrl+K the code block will be indented by four spaces, which will cause it to be rendered as code. – ChrisGPT was on strike Aug 14 '22 at 20:22

1 Answers1