elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.
 
Inicio Ayuda Buscar Ingresar Registrarse
14 Febrero 2012, 08:18  

+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web
| | |-+  Centrado con CSS para Firefox y IE7
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Centrado con CSS para Firefox y IE7  (Leído 2,591 veces)
jamarchi

Desconectado Desconectado

Mensajes: 150



Ver Perfil
Centrado con CSS para Firefox y IE7
« en: 19 Marzo 2010, 21:21 »

Hola gente, como les va ?.... estoy aqui para pedirle la ayuda de alguno de ustedes con este problemilla que tengo, tengo el siguiente codigo para centrar en CSS, la idea es que funcione en IE7 y en Firefox pero no es asi

Este es el codigo

Código:
.centrar
{
position: absolute;
/*nos posicionamos en el centro del navegador*/
top:50%;
left:50%;
/*determinamos una anchura*/
width:867px;
/*indicamos que el margen izquierdo, es la mitad de la anchura*/
margin-left:-434px;
/*determinamos una altura*/
height:750px;
/*indicamos que el margen superior, es la mitad de la altura*/
margin-top:-273px;


El problema es que el margin-top  deberia ser -375px pero de esa forma no funcina es

Gracias por la ayuda que me puedan dar

Saludos,


En línea
Syphroot

Desconectado Desconectado

Mensajes: 268


All You Need To Do Is Follow The Worms


Ver Perfil WWW
Re: Centrado con CSS para Firefox y IE7
« Respuesta #1 en: 20 Marzo 2010, 07:21 »

Puedes intentar:

Código
position:absolute;
height:300px;
width:400px;
top:50%;
left:50%;
margin-left: -200px; /* la mitad del ancho, negativo*/
margin-top: -150px; /* la mitad de la altura, negativo */
 

lo aplicas a tu clase ;)

Pruebalo y comentas.


En línea

jamarchi

Desconectado Desconectado

Mensajes: 150



Ver Perfil
Re: Centrado con CSS para Firefox y IE7
« Respuesta #2 en: 20 Marzo 2010, 18:24 »

Hola a todos y a ti Syphroot gracias por la respuesta

Lo probe de la siguiente manera y en ambos (IE7 y Firefox) salio como subido, osea, se centro horizontalmente pero verticalmente se subio un poco

Este es el codigo
Código:
position:absolute;
height:750px;
width:867px;
top:50%;
left:50%;
margin-left: -434px; /* la mitad del ancho, negativo*/
margin-top: -375px; /* la mitad de la altura, negativo */

Que mas puedo hacer ?  :huh:

Gracias por su ayuda  :)
En línea
~ Yoya ~
Wiki

Desconectado Desconectado

Mensajes: 907



Ver Perfil
Re: Centrado con CSS para Firefox y IE7
« Respuesta #3 en: 20 Marzo 2010, 19:43 »

Si lo que quieres es centra la capa...

Código
position:absolute;
height:750px;
width:867px;
top:10%;
margin-left: auto;
margin-right: auto;
 

De todas manera, yo prefiero usar % en vez de px...
En línea

a




Un buen artista copia ideas, un gran artista roba ideas.
No al Copy & Paste
MinusFour


Desconectado Desconectado

Mensajes: 2.057


I'm fourth.


Ver Perfil WWW
Re: Centrado con CSS para Firefox y IE7
« Respuesta #4 en: 20 Marzo 2010, 20:07 »

Eso funcionaría para un centrado horizontal. Pero creo que lo que quiere él es centrar tanto horizontal como verticalmente.

Según esta pagina: http://www.smashingmagazine.com/2009/10/05/mastering-css-coding-getting-started/#CSS-Basics1

Lo que dices debería funcionar :/
En línea

I have many names
jamarchi

Desconectado Desconectado

Mensajes: 150



Ver Perfil
Re: Centrado con CSS para Firefox y IE7
« Respuesta #5 en: 21 Marzo 2010, 02:48 »

Hola a todos....

Gracias por las respuestas, acabo de ver el link que puso MinusFour y muestra este codigo
Código:
.vertical {
width: 600px; /*--Specify Width--*/
height: 300px; /*--Specify Height--*/
position: absolute; /*--Set positioning to absolute--*/
top: 50%; /*--Set top coordinate to 50%--*/
left: 50%; /*--Set left coordinate to 50%--*/
margin: -150px 0 0 -300px; /*--Set negative top/left margin--*/
}

pero es casi de lo que hemos estado hablando... lo probe y me sale lo mismo...., este es mi codigo  :-[
Código:
.centrar
{
width: 867px; /*--Specify Width--*/
height: 750px; /*--Specify Height--*/
position: absolute; /*--Set positioning to absolute--*/
top: 50%; /*--Set top coordinate to 50%--*/
left: 50%; /*--Set left coordinate to 50%--*/
margin: -375px 0 0 -434px; /*--Set negative top/left margin--*/
}

#Table_01 {
width:867px;
height:750px;
}

y en el htm esta
Código:
<div id="Table_01" class="centrar">
...
...
</div>


Alguna idea ?????  :huh:

Que podra ser ? ..... gracias por la ayuda ...
« Última modificación: 21 Marzo 2010, 02:50 por jamarchi » En línea
Syphroot

Desconectado Desconectado

Mensajes: 268


All You Need To Do Is Follow The Worms


Ver Perfil WWW
Re: Centrado con CSS para Firefox y IE7
« Respuesta #6 en: 21 Marzo 2010, 06:53 »

Pon un RESET global y vez que sucede.

Tienes el de "Eric Meyer", el de Yahoo creo lo llaman YUI Reset... y hay mas... sólo googlealos ;)

para centrar horizontalmente con un simple (no en todos los casos):

Código
.aligncenter { margin:0 auto; }
 

El vertical, siempre ha sido un problema centrar verticalmente y hay muchos metodos o "trucos" jaja... pero el de posicionar al 50% (top) y restandole la "mitad" del alto al margen es el efectivo... pero al costo de tener un alto explicito (el height). Si no los pones, no funciona.

Los ejemplos del enlace son exactamente lo mismo que puse al principio, sólo condensaron los margenes en una sola linea ;)

Ponle un RESET y ya nos cuentas ;)

El reset minimo es:

Código
* {margin: 0; padding: 0}
 
En línea

Nakp
casi es
Ex-Staff
*
Desconectado Desconectado

Mensajes: 6.335

he vuelto :)


Ver Perfil WWW
Re: Centrado con CSS para Firefox y IE7
« Respuesta #7 en: 21 Marzo 2010, 06:55 »

solo por curiosidad... que doctype usas? xD
En línea

Ojo por ojo, y el mundo acabará ciego.
MinusFour


Desconectado Desconectado

Mensajes: 2.057


I'm fourth.


Ver Perfil WWW
Re: Centrado con CSS para Firefox y IE7
« Respuesta #8 en: 21 Marzo 2010, 13:26 »

Por cierto si estás haciendo la prueba desde internet, asegurate de que se refresque correctamente el CSS. Igual y estás cargando el CSS desde el cache :/
En línea

I have many names
jamarchi

Desconectado Desconectado

Mensajes: 150



Ver Perfil
Re: Centrado con CSS para Firefox y IE7
« Respuesta #9 en: 23 Marzo 2010, 15:53 »

Hola a todos....

Nakp: te refieres a esto ?  :huh:
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

MinusFour : A que te refieres con "asegurate de que se refresque correctamente el CSS. Igual y estás cargando el CSS desde el cache :huh:

Ggracias por la ayuda  :)
En línea
Nakp
casi es
Ex-Staff
*
Desconectado Desconectado

Mensajes: 6.335

he vuelto :)


Ver Perfil WWW
Re: Centrado con CSS para Firefox y IE7
« Respuesta #10 en: 23 Marzo 2010, 17:31 »

si... a eso :P eso determina en gran parte el comportamiento de una web en el navegador, sobre todo en IE que es tan mediocre xD

sobre asegurarte que el CSS se refresque... es que el CSS queda en el cache del navegador y tienes que recargar esa hoja (generalmente ctrl + f5 basta)
En línea

Ojo por ojo, y el mundo acabará ciego.
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  
Powered by SMF 1.1.16 | SMF © 2006-2008, Simple Machines