Verhindern, dass die Tabelle vom Umbruch betroffen ist

Question

Wie verhindere ich das Umbrechen einer Tabelle, wenn sie sich in einer äußeren Tabellenzelle befindet?

Werfen Sie einen Blick auf das vereinfachte Beispiel am Ende meiner Frage.

Mein aspx-TableRow:

<tr runat="server" id="trButtons"> 
    <td align="left" colspan="9" valign="top" style="white-space:nowrap"><br /> 
    <asp:Button ID="btnImeiLookup" OnClick="btnImeiLookupClick" runat="server" ValidationGroup="VG_RMA_LOOKUP" CausesValidation="true" Text="lookup IMEI" ToolTip="lookup IMEI and check if RMA-Number can be generated" Width="120px" /> 
    &nbsp;&nbsp;<asp:Button ID="BtnEdit" CommandName="Edit" CommandArgument='<%# Eval("idRMA")%>' ValidationGroup="VG_RMA_SAVE" runat="server" CausesValidation="false" Text="Edit" ToolTip="edit" Width="120px" /> 
    &nbsp;&nbsp;<asp:Button ID="BtnAdd" runat="server" CommandName="Add" CausesValidation="false" Text="Add new" Width="130px" ToolTip="add new" /> 
    &nbsp;&nbsp;<asp:Button ID="BtnDelete" runat="server" CommandName="Delete" CommandArgument='<%# Eval("idRMA")%>' CausesValidation="true" Text="Delete" Width="120px" ToolTip="delete" OnClientClick="return confirm('do you really want to delete this RMA?')" /> 
    &nbsp;&nbsp;<uc4:RmaPrinterView ID="RmaPrinterView1" Visible="true" runat="server" /> 
    </td> 
</tr> 

RmaPrinterView1 ist ein ASP.Net Usercontrol:

<table cellpadding="0" cellspacing="0"> 
<tr> 
    <td> 
     <input type="button" style="width:120px; white-space:nowrap" onclick="javascript:$('#TblPrinterView').jqprint();" value="Print" title="Print" /> 
    </td> 
</tr> 
<tr> 
    <td> 
     <table id="TblPrinterView" style="display:none"> 
      <tr> 
       <td style="width:100px;white-space:nowrap"> 
        <asp:Label ID="LblRmaNumberDesc" runat="server" Text="RMA-Number:"></asp:Label> 
       </td> 
       <td> 
        <asp:Label ID="LblRmaNumber" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <asp:Label ID="LblImeiDesc" runat="server" Text="IMEI:"></asp:Label> 
       </td> 
       <td> 
        <asp:Label ID="LblImei" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <asp:Label ID="LblModelDesc" runat="server" Text="Model:"></asp:Label> 
       </td> 
       <td> 
        <asp:Label ID="LblModel" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <asp:Label ID="LblSiDpyDesc" runat="server" Text="SI/DPY:"></asp:Label> 
       </td> 
       <td> 
        <asp:Label ID="LblSiDpy" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <asp:Label ID="LblSymptomCodesDesc" runat="server" Text="Symptoms:"></asp:Label> 
       </td> 
       <td> 
        <asp:Label ID="LblSymptomCodes" runat="server" Text="xxxxxxxxxxxxxx"></asp:Label> 
       </td> 
      </tr> 
     </table> 
    </td> 
</tr> 
</table> 

Wie Sie die Usercontrol mit der inneren Tabelle sehen kann, wird eingewickelt:

Ich weiß, dass ich a Leeres Tabellen-Layout, aber ich brauchte eine schnelle Arbeitslösung ;-)

EDIT: ein vereinfachtes Beispiel, das auch wickelt:

<table> 
    <tr> 
     <td style="white-space:nowrap"> 
     <input type="button" value="b1" />&nbsp; 
     <input type="button" value="b2" />&nbsp; 
     <input type="button" value="b3" />&nbsp; 
     <table> 
      <tr> 
      <td style="white-space:nowrap"><input type="button" value="in table" /></td> 
      </tr> 
     </table> 
    </td> 
    </tr>      
</table> 

UPDATE:
Die Lösung - wie Jeroen erwähnt - war, die Tabelle zu einem Inline-Element mit style="display: inline" zu machen. Das nächste Problem war, dass ich ein ASP.Net UpdatePanel im UserControl verwendete, das normalerweise als Div gerendert wird. Also das nächste Blockelement, das meine Tabelle umbrechen lässt. Ich musste nur UpdatePanel's RenderMode auf Inline setzen, was bewirkt, dass es als Span wiedergegeben wird.

Answer 1

Wenn die CSS white-space nicht funktioniert, können Sie versuchen, nowrap="nowrap" zu Ihrem td hinzuzufügen, so wie du valign="top" hinzugefügt.

Sehr hässlich, aber es sollte funktionieren.

Bearbeiten: Ah, jetzt sehe ich: Eine Tabelle ist ein Block-Level-Element, so dass es immer zu einer neuen Zeile gehen wird, es sei denn, Sie machen es zu einem Inline-Element oder float es.