wrapping text in ul li elements in a tree structure

adamhw · June 1st, 2013, 04:25 AM

Hi there

I've got limited space in an organisational cascading tree structure - I need to wrap the entries in the tree structure so that the long lines do exactly that - wrap.

I've tried defining a width for the ul and the parent div and have also tried the white-space:nowrap but nothing seems to touch it.

I've uploaded a screen shot to http://www.twm-hosting.co.uk/ul.png

to help you visualise it

Any help greatly appreciated!

thanks

meow · June 1st, 2013, 08:20 AM

Can you please post the URL to a sample page? We can't say what's wrong from a screen cap.

Generally text wraps if you don't stop it from doing so, lists are no exception. One way to stop it from wrapping is using white-space:nowrap, so that's not a good idea. Something, probably in your CSS, stops the text from wrapping.

Look at this. As long as the words aren't too long the text wraps.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>
<title>List lines wrap too</title>

<style type="text/css">
ul   { width: 3.5em; border: dashed }
</style>

</head>


<body>

<ul>
<li>Good morning</li>
<li>Rumpelstiltskin</li>
<li>'Twas brillig and the slithy toves</li>
</ul>

</body>
</html>