Home/ Questions/Q 8734697
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T09:53:43+00:00

By using bootstrap I would like to display green and red labels which context

  • 0

By using bootstrap I would like to display green and red labels which context is like a v or a x.

The v should be green and the x should be red.

I wrote the following code, but I would like to have a better effect. 

<span class="badge badge-success">V</span>
<span class="badge badge-important">X</span>

Any ideas how should I get it by using bootstrap?

Here is an example of what I would get by using bootstrap labels and badges.

enter image description here

enter image description here

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If you used font-awesome (http://fortawesome.github.com/Font-Awesome/) in combination with Twitter bootstrap (which it’s designed for), you would be able to do something like this:

    <i class="icon-ok-sign" style="color: green; font-size: 18pt;"></i>
<i class="icon-remove-sign" style="color: red; font-size: 18pt;"></i>
<br/><br/>

<i class="icon-ok-circle" style="color: green; font-size: 18pt;"></i>
<i class="icon-remove-circle" style="color: red; font-size: 18pt;"></i>
<br/><br/>

<i class="icon-ok" style="color: green; font-size: 14pt;"></i>
<i class="icon-remove" style="color: red; font-size: 14pt;"></i>

    Which would output this:

    enter image description here

    Or you could use CSS classes defined elsewhere to style them appropriately.

    Font-awesome is based upon SVG images and they scale to any size (within reason and use).
    You can now also subset the icons you need rather than including them all by default using icnfnt.

    • 0