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 셀의 데이터 배치

답변

관련 문제