CSS, DIV and Table Wrap Problem

I had this table within a DIV


<div id="tooltip_123" class="tooltip">
<table class="tooltip">
<tbody>
<tr>
<td>
The Business Communication System bundle combines an ADTRAN NetVanta 7100 or NetVanta 7060 with the NetVanta Unified Communications software to give the customer Unified Messaging providing access to voice mail and faxes within an email or desktop client. This solution provides a Fax Server, Personal Assistants, Graphical Drag-and-Drop Service Creation, Call Redirection Services, and Notifications. This solution requires a separate server to run the UC software. A server is not included in the BCS bundle.
Click here for more information.
</td>
</tr>
</tbody>
</table>
</div>


And CSS properties were:


div.tooltip { position: absolute; z-index: 1; white-space:pre-wrap; }
table.tooltip { border-collapse: collapse; width: 250px; color: #000; font-size: 10pt; border-width: 4px; border-color: #013777; }

This is what was showing up on screen

After some research, I changed DIV css to this:

div.tooltip { position: absolute; z-index: 1; visibility: hidden; white-space:pre-wrap;  }

and now it wrapped text without any problem and I see this now (white-space:pre-wrap; keeps white spaces as entered and wraps text when required):

Advertisement