problemas con los span

Fuentealba · #1 (**permalink**) 15/07/2011, 13:44

en el trabajo me an ducho que utilice los span, el problema es el siguiente:
cree un div y dentro estan los span pero resulta que todos no miden lo mismo he intentado con class pero no me funciona que puedo hacer?

GAST0N · #2 (**permalink**) 15/07/2011, 13:47

pega el codigo html y css para revisarlo .. saludos =)

Fuentealba · #3 (**permalink**) 15/07/2011, 13:54

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Antecedentes de la Operación</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="../css/styles.css" />
</head>
<body>

<div id="divGeneral">
<div id="datos">
<label>N° Operación</label>
<label>Rut Solicitante</label>
<label>Nombre</label>
<label>U.F.</label>

<span id="nOperacion">xxx</span>
<span id="rutSolicitante">xxx</span>
<span id "NOMBRE" class="medidas">xxx</span>
<span id="uf">xxx</span>

</div>

<div id="menu">menu</div>

<div id="divContenido">contenido
<div id="div1">

<div id="div2">
<label>previCiÓn de gastos operacionales</label>
</div>

<div id="div3">
<label>Valor de tasación</label>
<label>Valor garantía</label>
<label>subcidio</label>
<label>Monto Créto</label>
<label>pie</label>
<label>% financiamiento</label>
</div>

</div>

</div>

<div id="footer">Footer </div>
</div>
</body>
</html>

-------------------style-----------------------------
* { padding: 0; margin: 0; }

body {
font: bold 10px Arial, Helvetica, sans-serif;
font-size: 13px;
}
#divGeneral {
margin: 0 auto;
width: 922px;
margin-top:40px;
}
#menu{
color: #333;
width: 900px;
float: left;
padding: 10px;
height: 20px;
margin: 0px 0px 10px 0px;
background-color:#CCCCCC;
}
#datos
{
float: left;
width: 920px;
height:30px;
color: #333;
margin-bottom:5px;
font: bold 10px Arial, Helvetica, sans-serif;
text-transform: uppercase; /*letras mayusculas*/
text-align: center;

}

#datos label
{
color:#FFFFFF;
display:block;
font-weight:bold;
width:230px;
height:13px;
float:left;
background-color: #999999;
}

#datos span

{ color: #666666;
float: left;
width:228px;
border: 1px solid #999999;

}

#datos span .medidas
{
width:300px;
background-color:#999999;
}

/*#leftcolumn {
color: #333;
border: 1px solid #ccc;
background:#F6F0E0;
margin: 0px 0px 0px 0px;
padding: 10px;
height: 350px;
width: 200px;
float: left;
}*/
#divContenido {
float: right;
color: #333;
border: 1px solid #ccc;
background: #CCCCCC;
margin: 0px 0px 0px 0px;
padding: 10px;
height: auto;
width: 900px;
display: inline;
}
#div1
{
width:600px;
height:400px;
background-color:#FFFFFF;
margin:auto;
font-size:10px;
text-transform: uppercase; /*letras mayusculas*/

}
#div2
{
text-align:center;
height:14px;
background-color:#999999;
color:#FFFFFF;
font-size:10px;
padding-left:5px;
padding-top:2px;
}
#div3
{
width:120px;
height:120px;
float:left;
background: #CCCCCC;
margin-left:140px;
}
#div3 label
{
color: #666666;
display:block;
font-weight:bold;
height:15px;
float:left;
padding-top:3px;
padding-left:5px;
width:120px;
border: 1px solid #FFFFFF;
font-size:9px;
}
#div4
{
width:100px;
height:120px;
float:left;
background: #CCCCCC;
margin-left:1px;
}
#div4 span
{
color: #666666;
display:block;
font-weight:bold;
height:15px;
float:left;
padding-top:3px;
padding-left:18px;
width:80px;
border: 1px solid #FFFFFF;
font-size:9px;
}
#div5
{
width:100px;
height:120px;
float:left;
background: #CCCCCC;

}
#div5 span
{
color: #666666;
display:block;
font-weight:bold;
height:15px;
float:left;
padding-top:3px;
padding-left:18px;
width:80px;
border: 1px solid #FFFFFF;
font-size:9px;
}
#divTipoMoneda
{
width:200px;
height:15px;
color:#666666;
margin-top:60px;
margin-left:260px;

}
#divTipoMoneda label
{
color: #FFFFFF;
display:block;
font-weight:bold;
height:15px;
float: right;
width:99px;
text-align:center;
background-color: #999999;
}
#footer {
width: 900px;
clear: both;
color: #333;
border: 1px solid #ccc;
background-color:#F3F2ED;
margin: 0px 0px 10px 0px;
padding: 10px;
}
#divTit
{
text-align:center;
height:12px;
background-color:#999999;
color:#FFFFFF;
font-size:10px;
padding-top:1px;
margin-top:130px;
}
#divTit label
{
width:117px;
display:block;
float: right;
}
#divTit span
{ color: #666666;
float: left;
width:118px;
/* border: 1px solid #999999;*/
}

Fuentealba · #4 (**permalink**) 15/07/2011, 13:55

me tiene muy complicada hace menos de un mes que estoy trabajando con css y se han trasformado en un dolor de cabeza

GAST0N · #5 (**permalink**) 15/07/2011, 13:57

A que resultado queres llegar??.. es una lista o que??

Fuentealba · #6 (**permalink**) 15/07/2011, 14:05

el programador me a pedido que migre una pagina con tablas a divs para esto me pidio que utilizara los span (para entregar la info.) pero no puedo dar a cada uno su medida correspondiente, podría pero tendría que hacer miles de divs y reglas

emprear · #7 (**permalink**) 15/07/2011, 14:47

Fuentealba:

Es un poco confuso lo que estás haciendo, habría que ver tu tabla original para ver cual es el resultado que queres.

De todas formas, si tus span llevan por identificador un id, porque no usas ese id para aplicarles el estilo ?
Por ahi te da vueltas un
<span id "NOMBRE" class="medidas">xxx</span>
que tenes que corregir.

Finalmente, si lo que vas a mostrar son datos tabulados, que al menos es lo que se observa de tu ejemplo, para eso están justamente las tablas
saludos

Fuentealba · #8 (**permalink**) 16/07/2011, 16:44

okis lo intentaro =)