HTML/CSS包裝單元格的數據

如何在表格中包裝數據。目前如果模板名稱太長，我會得到一個滾動條。我希望它進入下一行。HTML/CSS包裝單元格的數據

<table class="selectablePreviousOrder dashboard"> 
    <tr ng-class-odd="'tableOdd'" ng-class-even="'tableEven'" style="cursor: pointer" 
     ng-class="{highlightSelectedSiteRow: selectOrderRow===$index}" ng-repeat="line in listOfProductTemplates | orderBy : '-creationDate'" sglclick="handleSingleClick(line.id)" ng-dblclick="handleSingleClick(line.id)"> 
     <td width="20%" style="max-width: 162px; overflow: auto;" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true" > <span style="margin-left: 5px; float: left">{{line.templateName}}</span></td> 
     <td width="12%" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true"><span style="margin-left: 5px; float: left">{{line.requestType}}</span></td> 
     <td width="24%" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true"><span style="margin-left: 10px; float: left">{{line.product}}</span></td> 
     <td width="18%" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true"><span style="margin-left: 10px; float: left">{{line.creationDate | date : expiryDateFormatter}}</span></td> 
     <td width="19%" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true" ><span style="margin-left: 15px; float: left">{{line.creatorName }}</span></td> 
    </tr> 
</table>

來源

2016-09-02 simba

你能提供一個JSfiddle你目前有什麼，並解釋你到目前爲止嘗試過的。 – MarLen

謝謝我發現一個解決方案..在跨度我使用了一種風格 – simba

正如在評論中提到，你可以用用CSS這樣做：

風格=「自動換行：打破字;」

玩得開心編碼:)

來源

2016-09-02 07:12:42 blobbymatt

HTML/CSS包裝單元格的數據

回答

相關問題