April 29, 2013 at 10:03 am #44431
I’m doing a site and the design has a lot of one-line justified text sections. It’s kinda important to keep it this way I guess.
Just curious, is there a way to do this or fake it without using images?
Text-align: justify; doesn’t do anything with single-line sections.
Using pixel-values for font-size isn’t reliable from browser to browser.
Anyone have any guidance?April 29, 2013 at 10:05 am #133500
>one-line justified text sections
Even if it’s just two words?
That sounds pretty awful.
>It’s kinda important to keep it this way I guess.
Is it…have you checked?April 29, 2013 at 10:28 am #133507
You can hack it like this:
I guess this is the easiest way to get the effect. Hard limits it to one line though. I don’t have time to verify how wide the browser support status is, but text-align-last is IE6+ I think. There are also other browser vendor specific properties, but I can’t recall those from the top of my head. Mobile web limits my search-ability right now.April 29, 2013 at 11:33 am #133513
Someone else is probably able to shorten the jQuery code.April 29, 2013 at 1:50 pm #133527
Images could be other alternative that isn’t mentioned yet, but that would require more work. It is quite easy to give `width: 100%;` to images and have them scale. All the rest isn’t that easy.April 29, 2013 at 2:57 pm #133534October 14, 2013 at 1:21 pm #152995
Fantastic tip Merri!
You must be logged in to reply to this topic.