无法更改div中表格的列/行高度

我正在使用我的Vertical_Table function生成表格。当我从div中删除表格时，我可以调整行和列的尺寸，但是当它位于div内部时，我无法更改它们。任何想法为什么？下面是一些jfiddle所以你可以看到我所谈论http://jsfiddle.net/6XAHR/无法更改div中表格的列/行高度

CSS代码

> #Pallate 
{ 
border: 1px solid black; 
position:relative; 
top:40px; 
margin:0 auto; 
width:1200px; 
height:360px; 
background-color: #C8C8C8; 
} 

#Scroll_Table_Border 
{ 
Position:relative; 
top:40px; 
Left:320px; 
border: 1px solid black; 
height:275px; 
max-width: 850px; 
background-color: #C8C8C8; 
} 

#Scroll_Table { 
left:25px; 
top:25px; 
white-space: nowrap; 
Position:Absolute; 
height:225px; 
max-width: 800px; 
width: 100% !important; 
overflow:auto; 
background-color: #C8C8C8; 
} 

#Button_Group_Title 
{ 
Position:Absolute; 
padding-right:5px; 
padding-left:5px; 
background-color: #C8C8C8; 
top:30px; 
Left:35px; 
z-index:2; 
} 
#Scroll_Table_Title 
{ 
Position:Absolute; 
padding-right:5px; 
padding-left:5px; 
background-color: #C8C8C8; 
z-index:2; 
top:30px; 
Left:335px; 
} 


#Button_Group { 
text-align:center; 
padding-top:30px; 
padding-bottom:15px; 
padding-right:25px; 
padding-left:25px; 
border: 1px solid black; 
position:Absolute; 
top:40px; 
left:20px; 
height:230px; 
width:200px; 
vertical-align: middle; 
background-color: #C8C8C8; 
}

HTML代码

<div ID = "Pallate" > 
<div ID = "Scroll_Table_Title">Trial Information</div> 
<div ID = "Button_Group_Title">View Results</div> 

<div ID = "Button_Group"> 
    <input type="button" ID = "Paper_Information" onclick="changeContent(this.id)" value="Paper Information" class = "Class_Button"> 
    <input type="button" ID = "Trial_Information" onclick="changeContent(this.id)" value="Trial Setting" class = "Class_Button"> 
    <input type="button" ID = "Results" onclick="changeContent(this.id)" value="Trial Results" class = "Class_Button"> 
    <input type="button" ID = "Control_Law" onclick="changeContent(this.id)" value="Control Algorithm" class = "Class_Button"> 
    <input type="button" ID = "Exercise" onclick="changeContent(this.id)" value="Exercise" class = "Class_Button"> 
    <input type="button" ID = "Actuator" onclick="changeContent(this.id)" value="Pump Properties" class = "Class_Button"> 
    <input type="button" ID = "Sensor" onclick="changeContent(this.id)" value="Glucose Sensor" class = "Class_Button"> 
    <input type="button" ID = "Blood_Glucose_Safety" onclick="changeContent(this.id)" value="Blood Glucose Safety" class = "Class_Button"> 
    <input type="button" ID = "Reference_Glucose" onclick="changeContent(this.id)" value="Reference Measurements" class = "Class_Button"> 
</div>

PHP代码

<div ID = "Scroll_Table_Border"> 
     <div ID = "Scroll_Table"> 
      <?php 
      $Columns = 'SELECT COLUMN_NAME FROM INFORMATION_SCHEMA.COLUMNS WHERE Table_NAME = \'Control_Law\''; 
      $Columns = sqlsrv_query($dbhandle,$Columns); 
      $Sets = array(sqlsrv_query($dbhandle, 'SELECT * FROM Control_Law WHERE [Paper ID] = ' . $ID)); 

      $i = 0; 
      while ($Row = sqlsrv_fetch_array($Columns)) 
      { 
      $Column_Vector[$i] = $Row[0]; $i++; 
      } 
      $Table_ID = 'Advanced_Table'; 
      $Columns_Vector = array($Column_Vector); 
      Vertical_Table($Columns_Vector,$Sets,'40px','',$Table_ID); 
      ?> 
     </div> 
</div>

来源

2014-04-29 Gaven

你可以用生成的HTML样本替换你的PHP，并把整个东西放在jsfiddle.net请。 – Daze

你是否将样式应用于td元素？ CSS真的很挑剔，你必须将任何表格元素应用到表格中的最低节点（） –

我刚刚发布了jfiddle，它具有我的表格，div和其他所有类型的样式。 – Gaven

#Scroll_Table { 
     left:25px; 
     top:25px; 
     white-space: nowrap; //REMOVE THIS 
     Position:Absolute; 
     height:225px; 
     max-width: 800px; 
     width: 100% !important; 
     overflow:auto; 
     background-color: #C8C8C8; 
}

这将得到它砸下来，那么你可以设置最大宽度。你现在在那里的文本的问题是它是全部1个字符串，没有空格。删除空格，它会正常下降。希望这可以帮助！

来源

2014-04-30 00:45:23

无法更改div中表格的列/行高度

回答

相关问题