格式HTML表格元素

Question

這看起來確實很微不足道，但我無法達到預期效果。我試圖在工具箱中添加一個新元素（一個分區內的表格）。但新添加的元素不一致。

Pass-through和Window query保持重疊，如下所示。

HTML表

<div style="float: left;" class="toolbox" id="toolbox"> 
    <table> 
    ... 
    <tr> 
     <td> 
      <label class="col-md-4 control-label">Simple Query</label> 
     </td> 
     <td> 
      <div class="squery" id="rId"></div> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <label class="col-md-4 control-label">Pass-through</label> 
     </td> 
     <td> 
      <div class="nElem" id="lId"></div> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <label class="col-md-4 control-label">Window Query</label> 
     </td> 
     <td> 
      <div class="wquery" id="wId"></div> 
     </td> 
    </tr> 
    ... 

CSS類nElem爲直通

的類的其它元件，簡單的查詢，窗口查詢，都是一樣的傳遞課程。唯一的區別是顏色。

.nElem { 
    border: 1px solid #346789; 
    box-shadow: 2px 2px 19px #aaa; 
    -o-box-shadow: 2px 2px 19px #aaa; 
    -webkit-box-shadow: 2px 2px 19px #aaa; 
    -moz-box-shadow: 2px 2px 19px #aaa; 
    -moz-border-radius: 0.5em; 
    border-radius: 0.5em; 
    opacity: 0.8; 
    width: 120px; 
    height: 72px; 
    line-height: 80px; 
    cursor: pointer; 
    text-align: center; 
    z-index: 20; 
    position: absolute; 
    background-color: darkslateblue; 
    color: black; 
    font-family: helvetica, sans-serif; 
    padding: 0.5em; 
    font-size: 0.9em; 
    -webkit-transition: -webkit-box-shadow 0.15s ease-in; 
    -moz-transition: -moz-box-shadow 0.15s ease-in; 
    -o-transition: -o-box-shadow 0.15s ease-in; 
    transition: box-shadow 0.15s ease-in; 
} 

工具箱（司在其中創建表）類

.toolbox { 
    margin: 0 auto; 
    margin-left: 10px; 
    width: 230px; 
    height:850px; 
    padding: 20px; 
    font-family: "Helvetica"; 
    font-size: small; 
    background: #f4f4f4; 
    border-radius: 3px; 
    -webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3); 
    box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3); 
} 

Answer 1

您的代碼是不夠的，瞭解這正是錯誤的。但我敢肯定，主要問題是position: absolute;對.nElem,.squery,.wquery等造成的。所以刪除這個屬性，再看看。 我試圖解決您的問題就在這裏：http://codepen.io/g1un/pen/ozZNkL

.nElem { 
    /*position: absolute;*/ 
}