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

时间:2014-04-29 23:13:29

标签: html css

我正在使用Vertical_Table function生成一个表格。当我从div中移除表格时,我可以调整行和列的尺寸,但当它位于div内部时,我无法更改它们。有什么想法吗?这是一些小问题,所以你可以看到我在谈论http://jsfiddle.net/6XAHR/

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 CODE

<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>

1 个答案:

答案 0 :(得分:0)

 #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个字符串,没有空格。删除空格,它将正常下降。希望这有帮助!