Foros del Web » Creando para Internet » CSS »

problema con las posiciones en navegadores

Estas en el tema de problema con las posiciones en navegadores en el foro de CSS en Foros del Web. hola a todos. tengo un problema con la visualización de una web según en el navegador que se vea. resulta que en mi pc, en ...
  #1 (permalink)  
Antiguo 01/08/2007, 14:45
Avatar de estibaliz2006  
Fecha de Ingreso: noviembre-2006
Mensajes: 439
Antigüedad: 11 años, 1 mes
Puntos: 1
problema con las posiciones en navegadores

hola a todos. tengo un problema con la visualización de una web según en el navegador que se vea. resulta que en mi pc, en el explorer, la web maquetada se ve así, donde la imagen es un fondo, y luego el texto se maqueta mediante divs. tenemos esta imagen:

http://www.altomp.com/imagenes/web-3.gif

bien. el caso es que si lo veo en otro navegador diferente o en otro pc, me da este resultado:

http://www.altomp.com/imagenes/web-31.gif

o incluso este otro:

http://www.altomp.com/imagenes/web-32.gif

bien. la página index es esta:

Código PHP:
<body style="background-image: url(fondo.jpg); background-color: #470300;background-repeat: no-repeat; background-attachment: fixed; background-position: center">
<
div id="cabecera">
aquí texto
</div
<
div id="enlaces">
aquí enlaces
</div
y la hoja de estilos es esta:
Código PHP:
/************************************Barra***********************************************************/
BODY
{
SCROLLBAR-FACE-COLOR#470300; SCROLLBAR-HIGHLIGHT-COLOR: #FEFDDE; SCROLLBAR-SHADOW-COLOR: #FFFFFF; SCROLLBAR-ARROW-COLOR: #FEFDDE; SCROLLBAR-BASE-COLOR: #FFffff; font-color: #ffffff; scrollbar-3d-light-color: #FFFFFF; scrollbar-dark-shadow-color: #FFFFFF
}
/************************************Fuentes***********************************************************/

.text1 {
    
FONT-WEIGHTnormalFONT-SIZE10pxCOLOR:#696969; LINE-HEIGHT: 12px; PADDING-TOP: 3px; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif 
}
/************************************divs***********************************************************/
#cabecera
{
padding-top120pxpadding-left405pxFONT-WEIGHTboldFONT-SIZE9pxCOLOR:#FEFDDE; FONT-FAMILY: Verdana; width: 85%; 
}
#enlaces
{
padding-top47pxpadding-left410pxFONT-WEIGHTboldFONT-SIZE10pxFONT-FAMILYVerdanawidth85%; 
}
.
textenlace0
{
COLOR:#FEFDDE; text-decoration: none 
}
.
textenlace0:hover {
{
COLOR:#FFFFFF; text-decoration: underline

qué tengo que hacer para que en cualquier navegador se vea correctamente, es decir, como lo veo yo en mi equipo?

gracias a todos.
  #2 (permalink)  
Antiguo 02/08/2007, 01:14
Avatar de estibaliz2006  
Fecha de Ingreso: noviembre-2006
Mensajes: 439
Antigüedad: 11 años, 1 mes
Puntos: 1
Re: problema con las posiciones en navegadores

alguien me ayuda?
  #3 (permalink)  
Antiguo 02/08/2007, 06:04
 
Fecha de Ingreso: noviembre-2002
Ubicación: Cerca de todo, lejos de la nada.
Mensajes: 82
Antigüedad: 15 años, 1 mes
Puntos: 0
Re: problema con las posiciones en navegadores

Oye, la verdad me he tomado el tiempo de ver tu código y te sugiero:
- Crea un contenedor donde metas toda la información, pues asi todo esta regado por todas partes.
- Tu código css tiene errores: te faltan ; en algunas instrucciones, estas mezclando mayúsculas y minúsculas
- La clase que le defines al body dentro de éste, ponla dentro de los estilos

En fin. Traté de hacer algo "similar" a lo que tu quieres, pero creo q es más fácil si pones un jpg (sin maquetar) y te ayudamos a construir lo que necesitas.

pego el código con algunos arreglos, pues no se como hiciste para que se te viera así, lo probe con IE 6 y 7 y FF1 y FF2 y nunca lo pude ver así.

Saludos

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ibm852" />
<title>Untitled Document</title>
<style type="text/css" media="screen">
/* Barra */
body
{
	scrollbar-face-color: #470300;
	scrollbar-highlight-color: #FEFDDE;
	scrollbar-shadow-color: #FFFFFF;
	scrollbar-arrow-color: #FEFDDE;
	scrollbar-base-color: #FFffff;
	font-color: #ffffff;
	scrollbar-3d-light-color: #FFFFFF;
	scrollbar-dark-shadow-color: #FFFFFF;
	background-image: url(fondo.jpg);
	background-color: #000000;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center;
	font-family: Verdana, Arial, Helvetica, sans-serif; 

}
/* Fuentes */

.text1 {
font-weight: normal;
font-size: 10px; 
color:#696969; 
line-height: 12px;
padding-top: 3px; 
}
/* divs */
#cabecera
{
	padding-top: 15px;
	padding-left: 15px;
	font-weight: bold;
	font-size: 1em;
	color:#FEFDDE;
	float: left;
	width: 300px;
	margin-left: 20px;
}
#enlaces
{
	padding-top: 15px;
	padding-left: 15px;
	font-weight: bold;
	font-size: 1em;
	font-family: Verdana;
	width: 300px;
	float: left;
	margin-left: 20px;
}
.textenlace0
{
color:#FEFDDE; 
text-decoration: none; 
}
#contenedor {
	height: 200px;
	width: 335px;
	background-color: #470300;
}
.textenlace0:hover {
{
color:#FFFFFF;
text-decoration: underline;
}  


</style>
</head>

<body>
<div id="contenedor">
<div id="cabecera">
aquí texto
</div> 
<div id="enlaces">
aquí enlaces
</div>  
</div>
</body>
</html>
  #4 (permalink)  
Antiguo 02/08/2007, 07:20
Avatar de estibaliz2006  
Fecha de Ingreso: noviembre-2006
Mensajes: 439
Antigüedad: 11 años, 1 mes
Puntos: 1
Re: problema con las posiciones en navegadores

nada....todo sigue igual. a ver. yo lo que quiero es que, con independencia de la resolución del monitor o del navegador que se utilice, el texto aparezca en esa situación y los enlaces en esa otra tal y como se ven aquí:

http://www.altomp.com/imagenes/web-3.gif

es decir, esta sería la forma normal de verse, o como debería verse, con independencia del navegador o de la resolución del monitor.

y no tengo narices a conseguirlo. cuando lo consigo en el explorer, luego lo pruebo en el mismo explorer a otra resolución y se joroba; si lo hago en otro navegador, también se joroba. jo, no hay alguna solución?
  #5 (permalink)  
Antiguo 02/08/2007, 10:12
Avatar de fearlex  
Fecha de Ingreso: septiembre-2003
Ubicación: Exiliado de mi patria
Mensajes: 1.047
Antigüedad: 14 años, 2 meses
Puntos: 5
Re: problema con las posiciones en navegadores

Primeramente:

1- ¿Va a tener un ancho fijo o se debe agrandar a todo el ancho de la resolucion del usuario?

2- ¿Va a tener un alto fijo, o se va a adaptar al contenido que tengas dentro.?

Esto es lo primero que debes pensar, responde las preguntas y seguimos.

Saludos
__________________
Ya viene llegando, el comunismo en Cuba, ya se esta acabando.
www.fearlex.com | www.fearlexworld.com
  #6 (permalink)  
Antiguo 02/08/2007, 10:14
Avatar de estibaliz2006  
Fecha de Ingreso: noviembre-2006
Mensajes: 439
Antigüedad: 11 años, 1 mes
Puntos: 1
Re: problema con las posiciones en navegadores

el fondo siempre será del mismo tamaño, es decir, de un ancho y un alto fijo, con lo cual, el texto y los enlaces siempre estarán en la misma posición, sea cual sea el navegador y sea cual sea su resolución. pero no lo consigo. cuando lo obtengo para el explorer, lo pruebo en opera por ejemplo, y nada. y al revés...
  #7 (permalink)  
Antiguo 02/08/2007, 12:29
Avatar de estibaliz2006  
Fecha de Ingreso: noviembre-2006
Mensajes: 439
Antigüedad: 11 años, 1 mes
Puntos: 1
Re: problema con las posiciones en navegadores

alguien me echa un cable?
  #8 (permalink)  
Antiguo 02/08/2007, 13:53
Avatar de estibaliz2006  
Fecha de Ingreso: noviembre-2006
Mensajes: 439
Antigüedad: 11 años, 1 mes
Puntos: 1
Re: problema con las posiciones en navegadores

nada, no logro entender por qué demonios en ie me va y en firefox, pero en opera no hay modo. sabéis algún modo de que funcione en todos, con independencia de la resolución de la pantalla y del navegador?
  #9 (permalink)  
Antiguo 03/08/2007, 05:07
Avatar de estibaliz2006  
Fecha de Ingreso: noviembre-2006
Mensajes: 439
Antigüedad: 11 años, 1 mes
Puntos: 1
Re: problema con las posiciones en navegadores

me estoy volviendo loca.....
  #10 (permalink)  
Antiguo 03/08/2007, 09:49
Avatar de fearlex  
Fecha de Ingreso: septiembre-2003
Ubicación: Exiliado de mi patria
Mensajes: 1.047
Antigüedad: 14 años, 2 meses
Puntos: 5
Re: problema con las posiciones en navegadores

Disculpa la demora pero raramente me conecto durante la noche.

Pues mira, si todo va a ser fijo entonces la cosa es mas facil, como mismo te dijo :.SMITEXX.: necesitas crear primeramente un conteneder el cual le tienes que declara las propiedades width y height en pixeles normalmente 933px X 570px.

Luego le aplicas la propiedad text-align:center al body para que centre tu contenido en IE, y al div contenedor le aplicas una propiedad: margin-left: auto y margin-right: auto;

Eso te lo centrara en Firefox y otros navegadores.

Ahora como regla general, SIEMPRE pon esto en el principio de tu hoja de estilos:


*
{
margin: 0;
padding: 0;
}


Esto reseteara todos los margenes y padding a 0 y a partir de ahi declararas los tuyos. Por que ?? Porque todos los navegadores interpretan las etiquetas HTML por defecto de manera diferente, ejemplo: IE le agrega 20px de margin-left a las listas (ul), etc.

So una vez echo eso, dejame saber.

Saludos
__________________
Ya viene llegando, el comunismo en Cuba, ya se esta acabando.
www.fearlex.com | www.fearlexworld.com
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:47.