Ver Mensaje Individual
  #1 (permalink)  
Antiguo 15/09/2010, 02:02
Avatar de Jask
Jask
 
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 773
Antigüedad: 18 años
Puntos: 15
De acuerdo Tamaño de la caja y texto

Muy buenas :)

Tengo un pequeño problemilla que descubrí hoy xD.
Sucede que tengo una caja con una imagen, nombre, número de votos y la opción de votar. El problema que tengo es que cuando el nombre de la caja, por llamarlo así, es más grande que la caja en si el texto baja, haciendo que la caja sea más grande, y como debajo de esta hay otra caja igual, esta bajaría y se descolocaría por el tamaño del texto.

Os pongo una imagen de ejemplo:


http://i55.tinypic.com/wk0bwm.png

Os dejo el código:

CSS

Código CSS:
Ver original
  1. .contenidoLista{
  2.     width:650px;
  3.     min-height:570px;
  4. }
  5.  
  6.     .nombreUnico{
  7.         font-size:12px;
  8.         padding:10px 0 0 5px;
  9.         font-weight:bold;
  10.         line-height:normal;
  11.     }
  12.  
  13.     .contenidoMini{
  14.         width:200px;
  15.         height:225px;
  16.         margin:5px 5px 20px 5px;
  17.         float:left;
  18.         display:block;
  19.     }
  20.    
  21.     .contenidoMini img{
  22.         margin:-6px 0 0 -6px;
  23.         border:1px solid #ff0000;
  24.         padding:0px;
  25.     }
  26.    
  27.     .espaciado{
  28.         margin-top:5px;
  29.     }
  30.  
  31.     .botonvotos{
  32.         color:#666666;
  33.         font-weight:bold;
  34.         padding:9px 0 0 0px;
  35.         text-align:center;
  36.     }
  37.    
  38.     .botonvotos input{
  39.         margin-right:3px;
  40.         margin-left:3px;
  41.         padding:0px;
  42.     }
  43.    
  44.     .fondoVotos{
  45.         background-image:url(images/fondo-votos.jpg);
  46.         background-repeat:no-repeat;
  47.         background-position:center;
  48.         height:33px;
  49.         margin-top:15px;
  50.     }
  51.    
  52.    
  53. .votarOk{
  54.     width:100%;
  55.     padding:20px;
  56.     border:1px dotted #3366FF;
  57.     background-color:#CFF;
  58.     text-align:center;
  59.     font-size:24px;
  60.     margin-top:15px;
  61. }

PHP

Código PHP:
# Guarda en una variabla la ID única de cada lista. Para poder identificarla. 
    $numLista = $_REQUEST['verlista'];
    
    ?>
    
    <form action="#" method="post" name="votarlista">
    
    <?php
    
# Selecciona todo de wp_lista cuando lista_id_propia es igual a $numlista que es la id única de cada sección.
    
$selectContenidoLista mysql_query("SELECT * FROM wp_lista WHERE lista_id_propia='$numLista' ");
    
$consultarListanoRepeat mysql_fetch_assoc($selectContenidoLista);
    
     
?>
     <h2><?php echo $consultarListanoRepeat['lista_categoria']; ?> </h2>
     <div class="contenidoLista">
          <div class="textoAzul margintop">
            <?php echo $consultarListanoRepeat['lista_nombreunico']; ?>    
        </div>
        <div class="textoListas">
            <?php echo $consultarListanoRepeat['lista_descripcion']; ?>
        </div>
        
    <?php
    
    $contenidoMiniR 
mysql_query("SELECT * FROM wp_lista WHERE lista_id_propia='$numLista' ORDER BY lista_votos DESC");
    
# Esto sería la repitición (poner cajas con imagen, nombre y votos )
    
$numeracion 1;
    while(
$conLista mysql_fetch_assoc($contenidoMiniR)){
        
    
    
//    echo $conLista['lista_nombre']." + ";
    
            // Cuenta cuantos registros hay en cada Lista para 
            // más adelante sumarle 1 al name del input radio
            
$queryContar "SELECT COUNT(*) FROM wp_lista WHERE lista_id_propia='$numLista' ";
            
$contar mysql_query($queryContar);
            
$contarPrint mysql_fetch_array($contar);
            
$numeroCajaLista $contarPrint[0];
    
    
        
?>
            <div class="contenidoMini">
                <img src="http://<?php echo $conLista['lista_imagen']; ?>" width='199' height='133' alt="<?php echo $conLista['lista_nombre']; ?>" />
                <div class="nombreUnico">
                
                    <?php 
                    
echo $numeracion.". ";
                    echo 
$conLista['lista_nombre']; 
                    
?>
                    
                </div>
                <div class="textogris espaciado">
                    <?php
                    
# Gestión de puntos que tiene
                    
echo "(".$conLista['lista_votos']." Puntos)";
                    
?>
                </div>
                <div class="fondoVotos">                
                    <div class="botonvotos">
                    <?php
                    
                        
// Imprime los 5 votones input radio.
                        
$numRadio 1;
                        while(
$numRadio <= 5){
                            
?>
                            <input type="radio" name="radio<?php echo $numeracion?>" value="<?php echo $numRadio?>" /><?php echo $numRadio?>
                            <?php
                            
                            $numRadio
++;
                        } 
// Cierra while numRadio
                        
                    
?>
                    </div>
                </div>
            </div>
            
        <?php
    $numeracion
++;    
    }
    
    
?>
    </div>
Muchas gracias :) !
__________________
Os iusti meditabitur sapientiam
Si te he ayudado, por qué no un poquito de Karma :) ?