CSS: Letter-spacing percent to completely fit the div container

Question

i need to fit completely a text in a 100% width div container.

I attempted using letter-spacing but it looks like only accepts px/em, and not percent value

Answer 1

Another solution if you don't have to be semantic, I mean if you need only the visual result, is to use flexbox.

So you have your

TEXT 1

We need to get this:

    T
    E
    X
    T
     
    1

So then you can apply CSS:

#myText {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
}

In order to transform the text to span you can use jQuery or whatever. Here with jQuery:

var words = $('#myText').text().split("");
$('#myText').empty();
$.each(words, function(i, v) {
    if(v===' '){
        $('#myText').append(' ');
    } else {
        $('#myText').append($("").text(v));
    }
});

For better results remove put letter-spacing: 0 into #myText so any extra spacing will be applied.