2017-07-18 84 views
-2

我嘗試了一些組合,但td的寬度未發生變化。 有人可以請指導。我試着改變寬度爲各種值。 它只是HTML代碼的一部分。無法更改html列的寬度

問題:我想增加每行的第一列的寬度並減小文本框的大小。

攤銷總額和總收入列太小,測試箱長於需要。

小提琴手 - https://jsfiddle.net/o50d5qjk/

HTML

<div id="bladdiv<%=divcount%>" style="display: none; height: 750px; width: 1020px; overflow-y: auto"> 
    <table border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
     <td> 
     <table> 
      <tr> 
      <td style="width:100px"></td> 
      <td> 
       <table id="Table_calc" cellspacing="1" cellpadding="1" width="102"> 
       <tr> 
        <div class="heading">Amortization Calculation</div> 

       </tr> 
       <tr> 
        <td valign='top' width="250px">Total numbers of amortization</td> 
        <td> 
        <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
        </td> 
       </tr> 
       <tr> 
        <td valign='top' width="250px">Interest rate %</td> 
        <td> 
        <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
        </td> 
       </tr> 
       <tr> 
        <td valign='top' width="250px">Amortization per year</td> 
        <td> 
        <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
        </td> 

       </tr> 
       <tr> 
        <td valign='top' width="250px">Interest per year</td> 
        <td> 
        <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
        </td> 

       </tr> 
       </table> 

      </td> 
      <td style="width:150px"></td> 
      <td> 
       <table id="Table_calc" cellspacing="1" cellpadding="1" width="102"> 
       <tr> 
        <div class="heading">Amortization Calculation</div> 

       </tr> 
       <tr> 
        <td valign='top' width="250px">Total numbers of amortization</td> 
        <td> 
        <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
        </td> 
       </tr> 
       <tr> 
        <td valign='top' width="250px">Interest rate %</td> 
        <td> 
        <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
        </td> 
       </tr> 
       <tr> 
        <td valign='top' width="250px">Amortization per year</td> 
        <td> 
        <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
        </td> 

       </tr> 
       <tr> 
        <td valign='top' width="250px">Interest per year</td> 
        <td> 
        <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
        </td> 

       </tr> 
       </table> 
      </td> 
      </tr> 
     </table> 

     </td> 


    </tr> 
    <tr> 
     <td style="width:400px" valign="top"> 
     <table id="Table_OwnersTogether" cellspacing="1" cellpadding="1" width="1020"> 


      <tr> 
      <th style="width: 400px" valign='top'>Income Details</th> 


      <th style="width:400px">2018 
       <!-- Faktiska ränta--> 
      </th> 
      <th width="13px">2019 
       <!-- Kalkylränta--> 
      </th> 
      <th width="13px">2020 
       <!-- Faktiska ränta--> 
      </th> 
      <th width="13px">2021 
       <!-- Kalkylränta--> 
      </th> 
      <th width="13px">2022 
       <!-- Faktiska ränta--> 
      </th> 
      <th width="13px">2023 
       <!-- Kalkylränta--> 
      </th> 
      <th width="13px">2024 
       <!-- Faktiska ränta--> 
      </th> 
      <th width="13px">2025 
       <!-- Kalkylränta--> 
      </th> 
      <th width="13px">2026 
       <!-- Faktiska ränta--> 
      </th> 
      <th width="13px">2027 
       <!-- Kalkylränta--> 
      </th> 


      </tr> 
      <!-- Inkomst före skatt --> 
      <tr> 
      <td style="width:250px" valign='top'>Val</td> 
      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1 %>'> 
      </td> 
      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_YEARLY_INCOME_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1 %>'> 
      </td> 
      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1" value='<%= MAN_KNID_OSS_GROSS_MONTHLY_INCOME_HH_1 %>'> 
      </td> 


      </tr> 
      <!-- Skatt --> 
      <tr> 
      <td style="width:250px" valign='top'>val2</td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_YEARLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_YEARLY_INCOME_TAX_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_YEARLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_YEARLY_INCOME_TAX_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width:13px" name="MAN_KNID_MONTHLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_MONTHLY_INCOME_TAX_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_MONTHLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_MONTHLY_INCOME_TAX_HH_1 %>'> 
      </td> 
      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_YEARLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_YEARLY_INCOME_TAX_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_YEARLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_YEARLY_INCOME_TAX_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_MONTHLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_MONTHLY_INCOME_TAX_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_MONTHLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_MONTHLY_INCOME_TAX_HH_1 %>'> 
      </td> 
      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_MONTHLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_MONTHLY_INCOME_TAX_HH_1 %>'> 
      </td> 

      <td> 
       <input readonly style="background-color: <%=slskb_color5%>;" type="text" style="width: 13px" name="MAN_KNID_MONTHLY_INCOME_TAX_HH_1" value='<%= MAN_KNID_MONTHLY_INCOME_TAX_HH_1 %>'> 
      </td> 


      </tr> 
      <!-- Skattefria inkomster --> 

     </table> 
     </td> 
    </tr> 

    </table> 
</div> 
+0

部分目前還不清楚什麼是您的問題。你能否提供代碼片段或小提琴? –

+0

你在說什麼?一行中只有多個標題。 –

+0

你想做什麼? –

回答

0

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title> table td width </title> 
 
\t <style> 
 
\t \t table, th, td { 
 
\t \t  border: 1px solid black; 
 
\t \t } 
 
\t </style> 
 
</head> 
 
<body> 
 

 
<table class="master-table"> 
 
    <thead> 
 
     <tr> 
 
      <th style="width:200px" > Session </th> 
 
      <th style="width:100px;" > Module </th> 
 
      <th style="width:150px;"> Mode of delivery </th> 
 
      <th style="width:300px;"> Duration </th> 
 
     </tr> 
 
    </thead> 
 
    <tbody data-reactid=".2.1.0.2.0"> 
 
     <tr data-reactid=".2.1.0.2.0.0:$0"> 
 
      <td> Session 1</td> 
 
      <td> CWTC Pre-Session Webinar 1</td> 
 
      <td> WebEx</td> 
 
      <td> 20 </td> 
 
     </tr> 
 
     <tr> 
 
      <td> Session 2 </td> 
 
      <td> CWTC Pre-Session Webinar 2 </td> 
 
      <td> WebEx </td> 
 
      <td> 1 </td> 
 
     </tr> 
 
     <tr> 
 
      <td> Session 3 </td> 
 
      <td> 1-Day Workshop </td> 
 
      <td> In-Person </td> 
 
      <td> 8 </td> 
 
     </tr> 
 
     <tr> 
 
      <td> Session 4 </td> 
 
      <td> Post Workshop Reinforcement </td> 
 
      <td> Self-Paced </td> 
 
      <td> Ongoing </td> 
 
     </tr> 
 
    </tbody> 
 
</table> 
 

 
</body> 
 
</html>