How to Capitalize first letter only using CSS in each case

Question

I want to Capitalize first letter only and other should be small using CSS

String is:

SOMETHING BETTER 
sOMETHING bETTER
Something bett         


        

Answer 1

You can try a combination of this answer and some javascript (using jQuery)

HTML:

    SOMETHING BETTER 
    SOMETHING BETTER 
    SOMETHING BETTER 

JAVASCRIPT:

$('.capitalize').each(function(){
    var text = this.innerText;
    var words = text.split(" ");
    var spans = [];
    var _this = $(this);
    this.innerHTML = "";
    words.forEach(function(word, index){
        _this.append($('', {text: word}));
    });
});

CSS:

.capitalize {
    text-transform: lowercase;
}

.capitalize span {
    display: inline-block;
    padding-right: 1em  
}

.capitalize span:first-letter {
    text-transform: uppercase !important;
}

Demo: http://jsfiddle.net/maniator/ZHhqj/