2013-10-05 43 views
2
<div id="panelBelow"> 
    <div id="moveLeftDown"> 
      <p>table here</p> 
    </div> 
</div> 

#panelBelow 
    { 
     width:100%; 
     height:30px; 
     background-color:#FFFFFF; 
     margin-top:15px; 
    } 

是否有可能在那裏放置一個表格而不是表格這裏的文本,但是讓它把表格換成div的寬度。我應該補充說,我的身體CSS也有填充。在一個div中包裹表

body 
    { 
     font-family:HelveticaNeue-Light; 
     font-size:14px; 
     padding:20px; 
     background-color:#808080; 
    } 
+0

是的,你可以把桌子上有。 – Jacques

+0

我怎樣才能包裹它?所以根據div的寬度縮放x列中的單元格? – dev6546

+0

那麼,你想動態調用一個流體列數?你需要javascript或jquery來確定你需要的列數。 – Jacques

回答

3

你可以把表格放在指定的DIV中。只有當你有像「abcdefghijklmnopqrstuvwxyzabcdefgh」這樣非常冗長的單詞時,你纔會遇到問題。

你可以過來使用word break和你的表永遠不會擴展父div。

<div id="panelBelow"> 
    <div id="moveLeftDown"> 
      <table> 
       <tr> 
        <td>1</td> 
        <td>Hello world!</td> 
        <td>Goes a long sentence</td> 
        <td>andyoumightbeafraidofthis</td> 
        <td>actions</td> 
       </tr> 
     </table> 
    </div> 
</div> 

body 
    { 
     font:normal 14px Arial; 
     padding:20px; 
     background-color:#808080; 
    } 

#panelBelow 
    { 
     width:300px; 
     background:#FFFFFF; 
     margin-top:15px; 
    } 

table { 
    border-collapse:collapse; 
    table-layout:fixed; 
} 

td{ 
    border:1px solid #ccc; 
    padding:5px 10px; 
    vertical-align:top; 
    word-break:break-word; 
} 

工作:http://jsfiddle.net/shekhardesigner/ej2RD/