Issue
I'm currently working on a project where I've applied the text-transform: capitalize; property to a specific class (div.c), but it doesn't seem to be working as expected when the text is in all capital letters.
Here's a snippet of the code:
<!DOCTYPE html>
<html>
<head>
<style>
div.c {
text-transform: capitalize;
}
</style>
</head>
<body>
<h2>text-transform: capitalize:</h2>
<div class="c">THIS IS TESTING CONTENT</div>
</body>
</html>
Solution
We can't apply capitalize when all letter are in uppercase
You can almost do it with:
.c {
text-transform: lowercase;
}
.c:first-letter, .c:first-line {
text-transform: uppercase;
}
OR You can also do it with JavaScript
Convert with JavaScript using .toLowerCase() and capitalize would do the rest.
Answered By - Aman
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.