无法更改 html 列的宽度
unable to change width of html column
我尝试了一些组合,但 td 的宽度没有改变。
有人可以 guide.I 尝试将宽度更改为各种值吗?
它只是 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>
<!DOCTYPE html>
<html>
<head>
<title> table td width </title>
<style>
table, th, td {
border: 1px solid black;
}
</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:[=10=]">
<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>
我尝试了一些组合,但 td 的宽度没有改变。 有人可以 guide.I 尝试将宽度更改为各种值吗? 它只是 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>
<!DOCTYPE html>
<html>
<head>
<title> table td width </title>
<style>
table, th, td {
border: 1px solid black;
}
</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:[=10=]">
<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>