这个页面包含了一个ext.grid,有3行记录,中间列都有一个checkbox
我的问题是:当只有checkbox的时候,行的高度较小,记为X,
而有字符和checkbox的时候行的高度较大,记为Y,
那么在这里怎么定义外部的css来控制checkbox的属性,或者别的属性,
使得3行的行高都是X????????????????<html>  
      <head>  
          <meta http-equiv="Content-Type" content="text/html; charset=GBK">  
          <script type="text/javascript" src="extjs/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
<link rel="stylesheet" type="text/css"
href="extjs/resources/css/ext-all.css" />
      </head>  
      <style>
      #qq{
       height:200px;
       width:100px;
       border:1px solid red
      }
      .tt{
       color:red
      }
      </style>
  <script>     
      Ext.onReady(function(){  
               
          var cm = new Ext.grid.ColumnModel([  
              {header:'编号',dataIndex:'id'},  
              {id:'tt',header:'名称',dataIndex:'name',renderer:renderSex,css:'tt'},  
              {header:'描述',dataIndex:'descn'}  
          ]);  
          
          function renderSex(value) {  
          if (value == 'name2') {   
              return "<input type='checkbox'  />";
          } else {  
              return "ss <input type='checkbox' style='margin:0px;padding:0 px' />";  
          }  
     }   
    
          //定义表格数据  
          var data = [  
              ['1','name s ','descn1'],  
              ['2','name2','descn2'],  
              ['3','name3','descn3'] 
          ];  
          //定主数据存储装配器  
          var ds = new Ext.data.Store({  
              proxy: new Ext.data.MemoryProxy(data),//来自内存  
              reader: new Ext.data.ArrayReader({}, [   
                  {name: 'id'},//数据列与表头通过mapping相关联  
                  {name: 'name'},  
                  {name: 'descn'}  
              ])  
          });  
          ds.load();//按设定装配数据  
          //定义表格  
          var grid = new Ext.grid.GridPanel({  
              renderTo:"grid",  
              store:ds,   
              colModel:cm,  
              width:500,  
              height:300  
          });  
          
      });      
  </script>          
      <body>  
           <div id="grid">            
           </div>  
           <div id="qq" class=tt>tttttttttt<input type=checkbox /></div>
      </body>  
  </html>

解决方案 »

  1.   

    将你的checkbox和文字一起放入到一个DIV中,DIV的style="white-space:nowrap;"。
    试试吧
      

  2.   

    这只可以定义被ext解释后的html框架 的         内部的属性,可以解决一些问题通过查找api找到的正确做法是
    把“{id:'tt',header:'名称',dataIndex:'name',renderer:renderSex,css:'tt'},  ”
    改为{id:'tt',header:'名称',dataIndex:'name',renderer:renderSex},
    然后再css中定义x-grid3-tt,比如
    .x-grid3-tt{
    color:blue;
    height:200px
    }  
      

  3.   

    上面写错了单词   应该是.x-grid3-col-checkbox