html - How to keep a sentence lined up perfectly after making the browser smaller? -
to honest, can't find right words adress problem, i'll try. first picture in picture, of first words of each sentence lined perfectly.
second picture in picture, first word of each sentence doesn't line eachother. happens when place in center text-align. know why that, sadly i'm not able fix easy thing fix.
this code tested with:
<!doctype html> <html> <head> <meta charset="utf-8"> <style> #text { text-align: left; word-wrap: break-word; width: 100%; max-width: 470px; } @media , (max-width: 1300px) { #text { text-align: center; } } </style> </head> <body> <div id="text"> random textjust random textjust random textjust random textjust random textjust random textjust random textjust random text random textjust random textjust random textjust random textjust random textjust random textjust random textjust random text random textjust random textjust random textjust random textjust random textjust random text random textjust random textjust random textjust random textjust random textjust random textjust random textjust random text random textjust random textjust random textjust random textjust random textjust random textjust random textjust random text random textjust random textjust random textjust random textjust random textjust random text </div> </body>
any appriciated, thanks.
if want remove gaps use this
#text { text-align:justify; word-break: break-all; }
here sample fiddle..
note: word-break: break-all
breaks word/letter unto next line. words or texts harder read..
Comments
Post a Comment