- This topic is empty.
February 4, 2013 at 4:19 pm #42472
I have requirement where CSS text should be in next line. Please see the attached image
Before Applying CSS
I want new line immediately after it is encountered with space. For example in Executive User I want “Executive” and “User” in different line but not in same line as shown in the above figure. For your understanding I have created image in paint how it should be after applying CSS. Please see the below figure
After Applying CSS
“Access Level Modified”February 4, 2013 at 5:33 pm #123332
That would be the simplest way.
Overall, it’s not worth it IMO.February 4, 2013 at 5:39 pm #123335
Thanks for your inputs though but java script is mostly not allowed in my project. If there is a way in CSS it is much appreciated. Thanks for your suggestions.February 4, 2013 at 5:41 pm #123337
Nope…not with CSS on the text.
CSS can’t detect spaces and there is no ‘first-word’ selector.February 4, 2013 at 5:45 pm #123338
Thanks Paulie_D for your input I will let them know that it is not possible through CSS.February 4, 2013 at 5:51 pm #123339
You can cheat though (although I wouldn’t recommend it)…http://codepen.io/Paulie-D/pen/uvDLtFebruary 4, 2013 at 7:26 pm #123353wolfcry911Participant
[Here’s one way](http://codepen.io/wolfcry911/pen/DtBns “”), a fork of Paulie’s penFebruary 5, 2013 at 1:38 am #123382
Yeah, I thought of that but it depends on the length of the first word being long.February 5, 2013 at 4:06 am #105683Kitty GiraudelParticipant
The simplest workaround with CSS would be to give a width to the labels in order to make the second word create a second line. But it’s not dynamic since it rely on words length.February 6, 2013 at 6:57 am #123552pratikbhatt2009Member
You can do one thing. Make one main div for check-box area.
Than in that place check-box in one div & right label in other div. And fix the width of right label & set line height. I think your problem will get resolved.February 6, 2013 at 7:52 am #123556
That has the same problem that it will depend on the length of the first word being long enough to create a break.
Unless there is an overriding UX / UI reason for this two line concept, I wouldn’t bother.February 6, 2013 at 7:57 am #123557
- The forum ‘CSS’ is closed to new topics and replies.