2011-09-21 178 views
-2

我想減小這個表的寬度,因爲它太寬了。需要幫助減少表的寬度

enter image description here

我加了這一點:style="width: 70%;表標籤,但它似乎並沒有工作。

<table align="center" class="data_table vert_scroll_table" style="width: 70%;"> 

 

 <ctl:vertScroll height="300" headerStyleClass="data_table_scroll" bodyStyleClass="data_table_scroll" enabled="${user.scrollTables}"> 
    <ctl:sortableTblHdrSetup topTotal="false" href="process.like_item_search"/> 
<table align="center" class="data_table vert_scroll_table" style="width: 70%;"> 
    <tr> 
     <ctl:sortableTblHdr title="MWSLIN" property="mwslin" type="top">MWSLIN</ctl:sortableTblHdr> 
     <ctl:sortableTblHdr title="SOR" property="sorCode" type="top">SOR</ctl:sortableTblHdr> 
     <ctl:sortableTblHdr title="Fiscal Year" property="fiscalYear" type="top">Fiscal<br/>Year</ctl:sortableTblHdr> 
     <ctl:sortableTblHdr title="Workload Year" property="workloadYear" type="top">Workload<br/>Year</ctl:sortableTblHdr> 
     <ctl:sortableTblHdr title="SAC" property="sac" type="top">SAC</ctl:sortableTblHdr> 
     <ctl:sortableTblHdr title="TAMCN" property="tamcn" type="top">TAMCN</ctl:sortableTblHdr> 
     <ctl:sortableTblHdr title="NSN" property="nsn" type="top">NSN</ctl:sortableTblHdr> 
     <ctl:sortableTblHdr title="WORKTYPE" property="workTypeId" type="top">Work Type</ctl:sortableTblHdr> 
     <ctl:sortableTblHdr title="NOMENCLATURE" property="nom" type="top">Nomenclature</ctl:sortableTblHdr> 
     <ctl:sortableTblHdr title="SUP" property="sup" type="top">Sup</ctl:sortableTblHdr> 
     <th class="narrow">Actions</th> 
    </tr> 

    <c:forEach var="bean" items="${likeItems}"> 

     <tr> 
      <td class="center">${bean.mwslin}</td> 
      <td class="center">${bean.sorCode.shortName}</td> 
      <td class="center">${bean.fiscalYear}</td> 
      <td class="center">${bean.workloadYear}</td> 
      <td class="center">${bean.sac}&nbsp;</td> 
      <td class="center">${bean.tamcn}&nbsp;</td> 
      <td class="center"><ctl:stringFormat format="@@@@[email protected]@[email protected]@@[email protected]@@@">${bean.nsn}</ctl:stringFormat>&nbsp;</td> 
      <td class="center">${bean.workTypeId.description}&nbsp;</td> 
      <td class="center">${bean.nom}&nbsp;</td> 
      <td class="center"><fmt:formatNumber type="currency" value="${bean.sup}"/>&nbsp;</td> 
      <td> 
      <a class="view" href="blah"><img class="edit" src="../images/icon_view.gif" border="0" alt="View"/></a> 
      </td> 


     </tr> 
    </c:forEach> 
</table> 
</ctl:vertScroll> 


</c:when> 
<c:otherwise> 
<c:set var="no_results_msg" scope="page" value="There are no results that match your search criteria." /> 
    <%@ include file="../../include/search-no-results.html" %> 
</c:otherwise> 
</c:choose> 

<%@ include file="../../include/footer.html" %> 
+0

它的Java ...它不是一個java問題tho –

+1

你想要一個流體寬度(自動調整)還是你用一個固定寬度的表罰款?對於固定寬度的表格,對錶格列寬度使用像素值屬性應該強制文本換行(假設文本中有一些空格) –

+0

非常好的JustChris ...你如何做「流體寬度」? –

回答

1

使用表列的像素值屬性應該強制文本換行(如果在它至少有一個空格)。使用style="width: 100px"並根據需要設置金額。或者,如果可以,請將此屬性設置爲CSS中列的類名。

+0

試圖..didnt似乎工作 –

+0

我剛剛改變了​​的類只是爲了使字體更小...感謝任何方式:) –

0

最可能發生的問題是<td> s在某處(在CSS文件或文檔中)具有固定寬度。如果是這種情況,改變<table>寬度將不會做任何事情,除非你有其他一些特殊的風格。

對於響應表寬度,我建議在<table><td>元素中添加基於百分比的寬度。你會在你的CSS文件中做到這一點。

0

我懷疑它只是擴大到適合其內容。

作爲一種修復方法,您可以爲諸如「工作類型」之類的列設置固定的寬度,這可能會變得太寬。