html td etiketi içindeki yazıların tek satırda sığdırma yapılarak(nowrap) gösterilmesi

Table etiketinin td etiketine; style özelliklerinden white-space:nowrap atamak işe yaramamaktadır.

Örneğin:

<style type="text/css">

#example1

{

width:300px;

border:1px solid #666;

background-color:#FEE;

} 

</style>

<div id="example1">

<table width="100%">

  <tr>

    <td style="width:10px; overflow:visible; white-space:nowrap; ">

       başlık 111 222

    </td>

    <td>

      <div style="height:5px; line-height:5px; border-bottom:solid 1px black;">

      </div>

    </td>

  </tr>

</table>

</div>

Yukarıdaki örnekte td hücresinin içindeki başlık 111 222 yazısı tek satırda gösterilmesini bekledik fakat yine de alt satıra kayma oldu. Fakat başlık 111 222 yazısının span etiketi içine yerleştirip span etiketine white-space: nowrap style özelliği verirsek istediğimiz olmaktadır.

Çalışan html kodu şu şekilde olacak yani:

<div id="example1">

<table width="100%">

  <tr>

    <td style="width:10px; overflow:visible; ">

       <span style="white-space:nowrap;">başlık 111 222</span>

    </td>

    <td>

      <div style="height:5px; line-height:5px; border-bottom:solid 1px black;">

      </div>

    </td>

  </tr>

</table>

</div>

Bu denemelerimi İnternet Explorer 7 üzerinde yaptım. Diğerlerinde de aynı şekilde olması büyük ihtimal.

 kaynak:
http://snook.ca/archives/html_and_css/problems_using