div標記中的表格溢出到div的外部

我想讓表格保留div標記但最後一部分的一半已丟失。這是我的HTML結構，我已經使用，div標記中的表格溢出到div的外部

.dataTable{ 
 
    \t table-layout: fixed;  \t  \t 
 
    } 
 
    .dataTable td{  \t 
 
    \t white-space: nowrap; 
 
    \t overflow: hidden; 
 
    \t text-overflow: ellipsis; 
 
    }

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <title>Bootstrap Example</title> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
</head> 
 
<body> 
 
<div class="row"> 
 
    <div class="col-md-12"> 
 
     <table class="dataTable"> 
 
     <tr> 
 
      <th>Company</th> 
 
      <th>Contact</th> 
 
      <th>Country</th> 
 
     </tr> 
 
     <tr> 
 
      <td>Alfreds Futterkiste</td> 
 
      <td>Maria Anders</td> 
 
      <td>Germany</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Centro comercial Moctezuma</td> 
 
      <td>Francisco Chang</td> 
 
      <td>Mexico</td> 
 
     </tr> 
 
     </table> 
 
    </div> 
 
    </div> 
 
    
 
</body> 
 
</html>

問題是我面臨

誰能幫我上懸而未決這個問題？

來源

2017-08-14 Udara

嘗試刪除'溢出：隱藏;' –

嘗試刪除溢出：隱藏;認爲它會在底部添加一個滾動條，如果你不想這樣做，那麼減少其中一列的寬度 – imBlue

嘗試爲此提供jsfiddle鏈接。 – kmg

試試這個：

.dataTable{ 
    table-layout: fixed; 
    width: 100%;    
}

希望這有助於你...

來源

2017-08-14 11:41:56 PraveenKumar

div標記中的表格溢出到div的外部

回答

相關問題