Sono rimasto incredibilmente felice quando CSS text-overflow: ellipsis (sposato con width e overflow: hidden introdotto nelle specifiche CSS e nei browser; la funzione ci ha permesso di smettere di provare a combinare il calcolo della larghezza di JavaScript con il calcolo e il troncamento della larghezza delle stringhe. Anche i puntini di sospensione CSS erano molto facili da usare. CSS text-overflow: ellipsis è ottima ma è essenzialmente pensata per rimpicciolire le stringhe solo alla fine; cosa succederebbe se volessimo rimpicciolire l’inizio di una schermata? è lo stesso, nel qual caso “vuoi visualizzare la fine della stringa, non l’inizio. Lascia che ti mostri un trucco per i puntini di sospensione all’inizio della stringa!

Il CSS

Mostra i puntini di sospensione nella parte anteriore di una stringa è mos alla fine è lo stesso dei puntini di sospensione, solo con un semplice trucco: per aggiungere i puntini di sospensione all’inizio di una stringa, utilizzare RTL e e text-align per ritagliare l’inizio della stringa! La riproduzione di RTL da text-align è un modo geniale per ottenere l’effetto desiderato dei puntini di sospensione CSS all’inizio di un elemento o di una stringa. Sarebbe fantastico per le specifiche CSS implementare un sistema di puntini di sospensione più robusto ma, per ora, adoro i trucchi CSS sorprendenti come questo!