Tema: varias columnas de la mism altura
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 04/08/2011, 10:07
Avatar de chalchis
chalchis
 
Fecha de Ingreso: julio-2003
Mensajes: 1.773
Antigüedad: 21 años, 6 meses
Puntos: 21
Pregunta varias columnas de la mism altura
hola amigos estoy haciendo un grid usando <div>
tengo varias columnas todo va bien mi problema es
como puedo hacer que todas las columnas tengan la misma
altura y el texto quede centrado este es mi script



Uploaded with ImageShack.us


Código CSS: 
Ver original
  1. .filasCalif
  2. {
  3.     top: 30px;
  4.     width:1241px;   
  5.     margin:0px; 
  6.     position: absolute; 
  7.     z-index:10;
  8.     line-height:20px
  9. }
  10.  
  11. .header_fila{
  12.     width:1241px;   
  13.     border-bottom: 1px solid #686868;
  14.     font-family:Arial, Helvetica, sans-serif;
  15.     font-weight:bold;           
  16. }
  17.  
  18. .header_fila_prim{
  19.     float:left;
  20.     width:1241px;   
  21.     background-color: #C0C0C0;
  22.     border: 1px solid #686868;
  23.     border-right:0px;
  24.     border-left:0px;
  25. }
  26.  
  27. .primero_fila {
  28.     float:left;
  29.     width:296px;
  30.     border-right: 1px solid #686868;
  31.     border-bottom: 1px dashed #686868;  
  32.     font-family:Arial, Helvetica, sans-serif;
  33.     font-weight:bold;       
  34. }
  35.  
  36. .primero_fila_irregular {
  37.     float:left;
  38.     width:296px;
  39.     border-right: 1px solid #686868;
  40.     border-bottom: 1px dashed #686868;  
  41.     font-family:Arial, Helvetica, sans-serif;
  42.     font-weight:bold;   
  43.     color:#800000;
  44. }
  45.  
  46. .segundo_fila {
  47.     float:left;
  48.     width:68px; 
  49.     border-right: 1px solid #686868;
  50.     border-bottom: 1px dashed #686868;  
  51.     font-family:Arial, Helvetica, sans-serif;
  52.     font-weight:bold;
  53. }
  54.  
  55. .tercero_fila {
  56.     float:left;
  57.     width:92px;
  58.     border-right: 1px solid #686868;
  59.     border-bottom: 1px dashed #686868;  
  60.     font-family:Arial, Helvetica, sans-serif;
  61.     font-weight:bold; 
  62. }
  63.  
  64. .cuarto_fila {
  65.     float:left;
  66.     width:100px;;
  67.     border-right: 1px solid #686868;
  68.     border-bottom: 1px dashed #686868;  
  69.     font-family:Arial, Helvetica, sans-serif;
  70.     font-weight:bold;    
  71. }
  72.  
  73. .quinto_fila {
  74.     float:left;
  75.     width:8px;;
  76.     border-right: 1px solid #686868;
  77.     border-bottom: 1px dashed #686868;  
  78.     font-family:Arial, Helvetica, sans-serif;
  79.     font-weight:bold;  
  80. }
  81.  
  82. .sexto_fila {
  83.     float:left;
  84.     width:55px;;
  85.     border-right: 1px solid #686868;
  86.     border-bottom: 1px dashed #686868;  
  87.     font-family:Arial, Helvetica, sans-serif;
  88.     font-weight:bold;     
  89. }
  90.  
  91. .siete_fila {
  92.     float:left;
  93.     width:30px;;
  94.     border-right: 1px solid #686868;
  95.     border-bottom: 1px dashed #686868;  
  96.     font-family:Arial, Helvetica, sans-serif;
  97.     font-weight:bold;  
  98. }
  99.  
  100. .siete_fila_fin {
  101.     float:left;
  102.     width:30px;;    
  103.     border-right:0px;
  104.     border-bottom: 1px dashed #686868;  
  105.     font-family:Arial, Helvetica, sans-serif;
  106.     font-weight:bold;
  107. }
  108.  
  109. .fecha_fila {
  110.     float:left;
  111.     width:90px; 
  112.     border-right: 1px solid #686868;
  113.     border-bottom: 1px dashed #686868;  
  114.     font-family:Arial, Helvetica, sans-serif;
  115.     font-weight:bold;   
  116. }
  117.  
  118. <div class="header_fila">
  119.                         <div class="header_fila_prim"><span class="campos_form_label">***</span></div>                      
  120.                     </div>  
  121.                     
  122.                     <!-- materia -->                                        
  123.                     <div class="primero_fila">
  124.                         <span class="campos_form_label">Sistemas de Almacenamiento y Manejo de Carga en Puertos</span>
  125.                     </div>
  126.                     <!-- grado -->
  127.                     <div class="segundo_fila" align="center">
  128.                         <span class="campos_form_label">-</span>
  129.                     </div>
  130.                     <!-- clave -->
  131.                     <div class="tercero_fila" align="center">
  132.                         <span class="campos_form_label">-</span>
  133.                     </div>
  134.                     <!-- seriacion -->
  135.                     <div class="cuarto_fila" align="center">
  136.                         <span class="campos_form_label">-</span>
  137.                     </div>
  138.                     <!-- 1 -->
  139.                     <div class="quinto_fila" align="center">
  140.                         <span class="campos_form_label" >-</span>
  141.                     </div>
  142.                     <!-- ciclo -->
  143.                     <div class="sexto_fila" align="center">
  144.                         <span class="campos_form_label">-</span>
  145.                     </div>
  146.                     <!-- calif -->
  147.                     <div class="siete_fila" align="center">
  148.                         <span class="campos_form_label">-</span>
  149.                     </div>
  150.                     
  151.                     <!-- repite -->
  152.                     <div class="quinto_fila" align="center">
  153.                         <span class="campos_form_label">-</span>
  154.                     </div>
  155.                     <div class="sexto_fila" align="center">
  156.                         <span class="campos_form_label">-</span>
  157.                     </div>
  158.                     <div class="siete_fila" align="center">
  159.                         <span class="campos_form_label">-</span>
  160.                     </div>
  161.                     <div class="quinto_fila" align="center">
  162.                         <span class="campos_form_label">-</span>
  163.                     </div>
  164.                     <div class="sexto_fila" align="center">
  165.                         <span class="campos_form_label">-</span>
  166.                     </div>
  167.                     <div class="siete_fila" align="center">
  168.                         <span class="campos_form_label">-</span>
  169.                     </div>      
  170.                                 
  171.                     <!-- extras -->
  172.                     
  173.                     <!-- 1 -->
  174.                     <div class="quinto_fila" align="center">
  175.                         <span class="campos_form_label">-</span>
  176.                     </div>
  177.                     <!-- fecha -->
  178.                     <div class="fecha_fila" align="center">
  179.                         <span class="campos_form_label">-</span>
  180.                     </div>
  181.                     <!-- calif -->
  182.                     <div class="siete_fila" align="center">
  183.                         <span class="campos_form_label">-</span>
  184.                     </div>
  185.                     
  186.                     <!-- 2 -->                  
  187.                     <div class="quinto_fila" align="center">
  188.                         <span class="campos_form_label">-</span>
  189.                     </div>
  190.                     <!-- fecha -->
  191.                     <div class="fecha_fila" align="center">
  192.                         <span class="campos_form_label">-</span>
  193.                     </div>
  194.                     <!-- calif -->
  195.                     <div class="siete_fila" align="center">
  196.                         <span class="campos_form_label">-</span>
  197.                     </div>      
  198.                     
  199.                     <!-- 3 -->          
  200.                     <div class="quinto_fila" align="center">
  201.                         <span class="campos_form_label">-</span>
  202.                     </div>
  203.                     <!-- fecha -->
  204.                     <div class="fecha_fila" align="center">
  205.                         <span class="campos_form_label">-</span>
  206.                     </div>
  207.                     <!-- calif -->
  208.                     <div class="siete_fila_fin" align="center">
  209.                         <span class="campos_form_label">-</span>
  210.                     </div>                      
  211.                     <!-- fin extras -->
__________________
gerardo
Última edición por chalchis; 04/08/2011 a las 10:13