Tag label 'inverted'


#1

Hello everyone !

Do you know how I can do an inverted label like this:
http://s16.postimg.org/xe4nydgwl/Capture_d_e_cran_2016_09_26_a_16_39_43.png

With this:

<a class="ui label">$10.00 </a>


#2

UPDATED:

Use scaleX() to invert the image:

.ui.label {
    -moz-transform: scaleX(-1);
        -o-transform: scaleX(-1);
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
        filter: FlipH;
        -ms-filter: "FlipH";
}

Produces the following result:

Sorry for misunderstanding your initial question.

OLD:

Simply add this CSS:

.ui.label {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

It rotates your label by 180 degrees. You can do similar transformations for other elements


#3

Yes, but the text will be inverted !
How can I do it without change text orientation ?

Regards,
Val.


#4

Updated the answer :slight_smile:


#5

###Thank you for your help,

The problem is that the text is not lisible. I would like this:
http://s21.postimg.org/c2oi1j74n/Capture_d_e_cran_2016_09_27_a_09_23_07.png

Regards,
Val.