Word Wrapping

Question

I am currently working on creating a web page using .NET 2008. We are getting information from a database and when displaying it I cannot get it to wrap underneath. For example:

 2231 Question 1
 2232 Mechanical Engineering Technologists and Technicians 
 2233 Industrial Engineering and Manufacturing Technologists

and Technicians 2234 Question 4

In 2233 how can I get it to go underneath to look like this:

 2231 Question 1
 2232 Mechanical Engineering Technologists and Technicians 
 2233 Industrial Engineering and Manufacturing Technologists 
      and Technicians 
 2234 Question 4

Thank you!

Answer 1

Well, there's a better way, but this can be done cheaply and quickly with tables.

<table>
<tr><td>2231</td><td>Question 1</td></tr>
<tr><td>2232</td><td>Mechanical Engineering Technologists and Technicians</td></tr> 
<tr><td>2233</td><td>Industrial Engineering and Manufacturing Technologists and Technicians</td></tr> 
<tr><td>2234</td><td>Question 4</td></tr>
</table>

Well, I tried to implement it in markdown, but it didn't like it.

Answer 2

I would structure your HTML in the following manner:

<div class="qNumber">2231</div>
<div class="qContent">Question 1</div>
<div class="clear"></div>

<div class="qNumber">2232</div>
<div class="qContent">Mechanical Engineering Technologists and Technicians</div>
<div class="clear"></div>

<div class="qNumber">2233</div>
<div class="qContent">Industrial Engineering and Manufacturing Technologists and Technicians </div>
<div class="clear"></div>

<div class="qNumber">2234</div>
<div class="qContent">Question 4</div>
<div class="clear"></div>

And your CSS would be the following:

.qNumber { float: left; width: 40px; }
.qContent { width: 350px; padding-left: 40px; }
.clear { clear: both; }

Obviously tweak the number to your liking :)