Foros del web, para los que viven de bits

Ruyman · 12-mar-2008, 07:37

En realidad quiero colocar cuatro elementos, pero para simplificarlo pregunto por la forma de colocar 3 y después ya veré como colocar el 4º, como una imagen vale mas que 1000 palabras ahí va lo que quiero hacer:

Ahora mismo tengo el html de la siguiente forma:

Código HTML:

<body>
<div id="contenedor">
<div id="empuje"></div>
</div>
<div id="pie">
	<span id="logo">
	<img src="img/logo.gif" title="Logo  alt="Logo" /></span>
	
	<span id="direccion">
	TEXTO<br />
	TEXTO<br />
	TEXTO</span>
	
	<span id="nombres">
	TEXTO<br />
	TEXTO<br />
	TEXTO<br />
	</span>

</div>
</body>

Y el css

Código:

*{margin:0;}

html, body {
height:100%;
text-align:right;
}

#contenedor{
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -220px;

}
#pie, #empuje{
height:220px;
}
#pie{
margin-right:50px;
}
#logo{
float:right;
}
#nombres{
float:right;
margin-right:-330px;
}
#direccion{
float:right;
margin-top:140px;
}

Con este código consigo lo que necesito en Firefox pero no en Internet explorer 6 ni 7.
¿Alguna sugerencia? Seguramente haya una forma más sencilla de plantear la solución al problema.

Por cierto el código para poner el pie de página al pie lo he sacado de aquí pie de pagina pegajoso.

Gracias ;)

Ruyman · 12-mar-2008, 08:13

Viendo como posicionar el eslogan he conseguido una posible solución para el problema que tenía, dejando el id nombres de la siguiente forma ya se ve bien en FF y en IE.

Código:

#nombres{
position:absolute;
float:right;
right:254px;
}

De todas formas se agradece si hay otros posibles planteamientos.

Ruyman · 12-mar-2008, 08:16

Se me olvidaba, el eslogan lo coloqué en el html al principio del pie con este css

Código:

#slogan{
position:absolute;
right:35px;
}

Y como necesitaba poner el texto en vertical utilicé este javascript.

12-mar-2008, 07:37	#1 (permalink)
Ruyman Fecha de Ingreso: junio-2007 Mensajes: 60	Colocar 3 elementos a la derecha En realidad quiero colocar cuatro elementos, pero para simplificarlo pregunto por la forma de colocar 3 y después ya veré como colocar el 4º, como una imagen vale mas que 1000 palabras ahí va lo que quiero hacer: Ahora mismo tengo el html de la siguiente forma: Código HTML: <body> <div id="contenedor"> <div id="empuje"></div> </div> <div id="pie"> <span id="logo"> <img src="img/logo.gif" title="Logo alt="Logo" /></span> <span id="direccion"> TEXTO<br /> TEXTO<br /> TEXTO</span> <span id="nombres"> TEXTO<br /> TEXTO<br /> TEXTO<br /> </span> </div> </body> Y el css Código: *{margin:0;} html, body { height:100%; text-align:right; } #contenedor{ min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -220px; } #pie, #empuje{ height:220px; } #pie{ margin-right:50px; } #logo{ float:right; } #nombres{ float:right; margin-right:-330px; } #direccion{ float:right; margin-top:140px; } Con este código consigo lo que necesito en Firefox pero no en Internet explorer 6 ni 7. ¿Alguna sugerencia? Seguramente haya una forma más sencilla de plantear la solución al problema. Por cierto el código para poner el pie de página al pie lo he sacado de aquí pie de pagina pegajoso. Gracias ;) __________________ Servicio técnico informático

12-mar-2008, 08:13	#2 (permalink)
Ruyman Fecha de Ingreso: junio-2007 Mensajes: 60	Re: Colocar 3 elementos a la derecha Viendo como posicionar el eslogan he conseguido una posible solución para el problema que tenía, dejando el id nombres de la siguiente forma ya se ve bien en FF y en IE. Código: #nombres{ position:absolute; float:right; right:254px; } De todas formas se agradece si hay otros posibles planteamientos. __________________ Servicio técnico informático

12-mar-2008, 08:16	#3 (permalink)
Ruyman Fecha de Ingreso: junio-2007 Mensajes: 60	Re: Colocar 3 elementos a la derecha Se me olvidaba, el eslogan lo coloqué en el html al principio del pie con este css Código: #slogan{ position:absolute; right:35px; } Y como necesitaba poner el texto en vertical utilicé este javascript. __________________ Servicio técnico informático

Herramientas
Mostrar Versión Imprimible Enviar por Correo
Desplegado
Mode Lineal Cambiar a Modo Hibrido Cambiar a Modo Hilado