Problema con responsive porfavor Es mi primera vez aqui !. Conozco más este tema del diseño web y justo estoy ayudando a mi amigo en su nueva empresa.
Este problema que necesito resolver es un quebradero de cerebro. Miren, los textos de la SEGUNDA COLUMNA del cuadro "Datos Generales", quisiera que al hacer RESPONSIVE ajustando la ventana al maximo se queden DEBAJO de las palabras que estan en NEGRITA que son los titulos...................
...........Pude hacer el responsive, pero al ajustar mas la ventana toda la lista se desordena.
Les adjunto los codigos HTML, CSS Y mas abajo las url de capturas JPG. La Foto 3 verán lo HORRIBLE y DESORDENADO que queda......Si fuera posible, que las que estan en NEGRITAS queden en una sola linea y no partido.
DESDE ANTEMANO MUCHAS GRACIAS POR TODO Y UN FUERTE ABRAZO !!
<!-----------------------------------------HTML----------------------------------->
<div class="widget-body">
<div class="row-fluid">
<p class="lead">
<span class="lead1">Código:</span><span class="lead2">cl_prb</span></p>
<p class="lead">
<span class="lead1">Nombre & Apellidos:</span><span class="lead2">Coca-Cola</span></p>
<p class="lead">
<span class="lead1">Tipo de Cuenta:</span><span class="lead2">Pre-Pago</span></p>
<p class="lead">
<span class="lead1">Saldo Disponible:</span><span class="lead2">Respuesta</span></p>
<p class="lead">
<span class="lead1">Fecha Ultimo Pago:</span><span class="lead2">Respuesta </span></p>
<p class="lead">
<span class="lead1">Monto del Ultimo Pago:</span><span class="lead2">Respuesta</span></p>
</div>
</div>
/*--------------------------------------------------CSS-----------------------------------------*/
span.lead1{
display:block;
float:left;
width: calc(100%/1.5 - 2*1em - 2*1px);
}
span.lead2{
display:block;
font-weight:normal;
min-width:100px;
}
//-------------------------------------CAPTURAS-------------------------------------------//
FOTO 1:
oi61.tinypic.com/2vtdrv4.jpg
FOTO 2:
oi61.tinypic.com/oixhm1.jpg
FOTO 3:
oi62.tinypic.com/2ajwcx0.jpg
