javascript - 如何在CSS中减少一列并增加另一列？

Question

我正在尝试设置 Date 列的 width:13%。但这对我不起作用。哪里有问题？并且不能减少 subject 列的 width。提前致谢。

检查 FIDDLE

<div style="width:70%;float:left;">
   <div>
      <table style="width:100%;" class="TicketsDashboard">
         <tbody>
            <tr>
               <td style="width:13%"><b>Date</b></td>
               <td ><b>Type</b></td>
               <td ><b>Subject</b></td>
               <td ><b>Responsible</b></td>
               <td ><b>Action</b></td>
            </tr>
            <tr style="cursor:pointer;" onclick="openDetailDiv('PROT-155',124)">
               <td>2019-07-21 12:52:08</td>
               <td>Recommendation</td>
               <td>First Subject going on perfectly edited</td>
               <td>perfect</td>
               <td class="editButtonMain">Edit</td>
            </tr>
            <tr style="cursor:pointer;" onclick="openDetailDiv('PROT-155',125)">
               <td>2019-07-21 12:53:26</td>
               <td>Decision</td>
               <td>lklk kdj djjdjdjdjdjdjdjdjdjdjdjdjdjdjjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdj</td>
               <td>bangldesh</td>
               <td class="editButtonMain">Edit</td>
            </tr>
         </tbody>
      </table>
   </div>
   <br>
   <div id="ticketButtons"><input type="button" class="Btn" onclick="openDiag({function: &quot;item&quot;, id: 155, dialogTitle: this.value})" value="Add Protocol Item"></div>
</div>
<div style="width:30%;float:left">
   <table style="width:100%;" class="lightborder" id="headTable">
      <tbody>
         <tr id="slaTr">
            <td width="100" valign="top">SLA:</td>
            <td>
               <div id="effortDiv" style="width:50%;float:left;text-align:center;padding-bottom:10px;display:none"></div>
               <div id="timeDiv" style="text-align:center;padding-bottom:10px;display:none"></div>
            </td>
         </tr>
         <tr>
            <td width="100">Status:</td>
            <td id="statusTd">Suggestion</td>
         </tr>
         <tr>
            <td>Protocol Number:</td>
            <td id="breadCrumb">PROT-155</td>
         </tr>
         <tr>
            <td>Subject:</td>
            <td id="protsubject">Chonchol -- test</td>
         </tr>
         <tr>
            <td>Start Date:</td>
            <td id="protstartdate">0000-00-00 00:00:00</td>
         </tr>
         <tr>
            <td>End Date:</td>
            <td id="protenddate">0000-00-00 00:00:00</td>
         </tr>
         <tr>
            <td>Keeper:</td>
            <td id="protkeeper">ewrwer</td>
         </tr>
      </tbody>
   </table>
</div>

Answer 1

您的主题栏即将消失，因为您没有在此代码中使用空格 <td>lklk kdj djjdjdjdjdjdjdjdjdjdjdjdjdjdjjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdjdj</td>如果你想停止超过你可以像这样给空间 <td>lklk kdj djjdjdjdjdjd jdjdjdjdjdjdjdj djjdjdjdjdjdjdj djdjdjdjdjdjdjdjdjdjdjdj djdjdjdjdjdjdjdjdjdjdjdjdjdjdj</td> 你到底想得到什么，让我们清楚地知道。