I have a parent div, Inside that div I have two levels of children div as follow,\[code\]<div class="grandParant"> <div class="parant1">test</div> <div class="parant2"> <div class="child">Hello world this is a long test string</div> <div class="child">12</div> <div class="child">4545</div> </div></div>\[/code\]from the above sample code, I need to show the entire first "child" class content(Hello world this is a long test string) without any break, ie in a single line. The width of the "parant2" div should also be incremented with respect to the child width. So how could this be done with css? I am not posting my css since it is a little bit lengthy, but you can see it in jsfiddle.EDITmy expected output is more like the alphabet 'L'\[code\]| test || Hello world this is a long test string || 12 || 4545 |\[/code\]my jsfiddle expected output thanks @mattytommo