Cristian
Cristian

Reputation: 111

Capitalize does not work if the text to capitalize is uppercase in ionic3

In my page i receive a username in uppercase and i want to capitalize.
The problem is that when i apply the text-transform: capitalize! Important; it does not work.

On the other hand, if the value i receive is lowercase, if it works.

Any ideas to make a directive that capitalize my uppercase text?

My element:

<ion-card-title text-capitalize>{{data.userName}}</ion-card-title>

Upvotes: 2

Views: 944

Answers (1)

MohammedAli
MohammedAli

Reputation: 2519

page.html

<ion-card-title text-capitalize class="uname">{{data.userName}}</ion-card-title>

page.css

.uname{
    text-transform: lowercase !important;
}
.uname::first-letter{
    text-transform: uppercase !important;
}

Upvotes: 1

Related Questions