Re: Vusualisacion Firefox y IE.

[marcosnc_08]

Bueno capos del diseño web posteo para pedirles ayuda con mi pagina que esta echa en html+css.

El problema es el siguente: Cuando la visualizo en Firefox se ve todo perfecto.

http://img355.imageshack.us/my.php?image=vsfirefoxco2.png

Pero cuando lo visualizo en IE miren:

http://img508.imageshack.us/my.php?image=vsiezw7.png

Bueno la direccion para que vean la pag: http://expomadero.webcindario.com/prueba
Espero que me puedan ayudar.

Desde ya, muchas gracias a todos.

Bye, nos vemos

[Calizman]

Saludos marcosnc_08!

Creo que la solucion a tu problema, es hacer una hoja de estilos aparte para el IE, revisa que el validador de CSS valide todo tu trabajo y tu hoja de estilos actual. Si no lo hace, entonces si dedicate a hacer una hoja nueva para el tedioso y problematico IE

Saludos!

(Revisa antes si tienes errores y corrigelos! asi sabras si es problema tuyo o de el Explorador)

[willyfc]

vamos de apoco tu menú sale así por que te falta una línea de código para que se muestre horizontal

Código:

#menu ul li a {
	width: 120%;
	text-align: center;	
	display:inline;
}

[marcosnc_08]

Bueno muchas gracias, lo de el menu lo solucione. Ahora lo que pasa es que la pagina se ve corrida, no esta bien ubicada. Tampoco se ve el logo que tiene en el header.

[marcosnc_08]

willyfc o alguien que me ayude por favor.

[Calizman]

Corrida? como corrida? no esta centrada tu pagina? explica mejor el termino y asi podremos ayudarte si?

Gracias!!

[marcosnc_08]

Bueno mira con el IE que la seccion de noticias esta pocisionada incorrectamente. Compara la vista del Firefox con el IE. La vista del Firefox es como yo quiero que se vea.


Muchas gracias.

[marcosnc_08]

El validador me detecto unos errore que ya aregle pero el problema sigue.

PD: Les dejo karma positivo.

[poison_mayer]

Mira haz esto
<div id="noticias">
<h4 class="noticia">Ultimas Noticias:</h4>
<p class="noticia_titulo">Pagina renovada</p>
<p class="noticia_info">Fecha: 15/12/08</p>
<p class="noticia_contenido">Lorem Ipsum es simplemente el texto de relleno de las imprentas y archivos de texto.</p>
</div>
Y luego
<div style="clear:both"></div>
<div id="footer">Dark Source.com.ar v1.0 beta Copyright 2008 - 2009. Todos los derechos reservados</div>

espero te resulte

[marcosnc_08]

Posion_mayer muchas gracias, lo que me dijiste no me soluciono el problema, pero me dio pie a solucionarlo.
El problema era que el margen del id contenedor tenia cualquier valor asignado y eso desconfiguraba todo. Te doy karma por la ayuda.

El ultimo problema es que el IE no reproduce el logo del header que tiene formato ".png", yo creo que es un problema del IE al reproducir "png".

¿hay forma de solucionarlo?

Intente ponerlo en otros formatos, pero estos no acepatan la transparencia del fondo del logo.

Muchas Gracias.

[poison_mayer]

Disculpa es que olvide lo mas importante jejejeje
#noticias {
float: left;
}

[poison_mayer]

para resolver lo del logo usa esto
<div id="header">
<div id="logo"><a href="index.html"><img src="css/logo/logo.png" alt="dark-source" width="700" height="100" border="0" /></a></div>
</div>

[marcosnc_08]

Iniciado por poison_mayer

para resolver lo del logo usa esto
<div id="header">
<div id="logo"><a href="index.html"><img src="css/logo/logo.png" alt="dark-source" width="700" height="100" border="0" /></a></div>
</div>

Bueno copie el codigo del logo tal cual y sigue sin aparecer. No te olvidaste nada???

[poison_mayer]

Acabo de revisar tu código fuente y no me parece que hayas hecho lo que te dije lo que dije fue que pongas el <div id=logo>...</div> dentro de <div id=header></div> algo asi
<div id=header>
<div id=logo>...</div>
</div>

[willyfc]

lo que dice poison_mayer es correcto debes poner el logo dentro de header, dale tamaño al div menu y el contenedor cambialo de esta forma

Código:

#contenedor {
    color: #FFFFFF;
    margin: 0 auto 0px auto;
    width: 890px;
	height:auto;
	display:table;
    background-color: #000;
}

y el #menu así

Código:

#menu {
    background-image: url(img/toolbar-bg.png);
	background-repeat: repeat-x;
	margin: 0;
	padding: 0;
	width: 890px;
	height:30px;
}

vamos así primero y disculpa por no ayudarte pero es que es fin de año y estamos cerrando trabajos no fue de mala honda

prueba eso y avisas si mejora o empeora

[willyfc]

aquí aumenta esto

Código:

<div style="width:auto; height:auto; text-align:left;"> 
<h4 class="noticia">Ultimas Noticias:</h4> 
<p class="noticia_titulo">Pagina renovada</p> 
<p class="noticia_info">Fecha: 15/12/08</p> 
<p class="noticia_contenido">Lorem Ipsum es simplemente el texto de relleno de las imprentas y archivos de texto. Lorem Ipsum ha sido el texto de relleno estándar de las industrias desde el año 1500, cuando un impresor (N. del T. persona que se dedica a la imprenta) desconocido usó una galería de textos y los mezcló de tal manera que logró hacer un libro de textos especimen. No sólo sobrevivió 500 años, sino que tambien ingresó como texto de relleno en documentos electrónicos, quedando esencialmente igual al original. Fue popularizado en los 60s con la creación de las hojas "Letraset", las cuales contenian pasajes de Lorem Ipsum, y más recientemente con software de autoedición, como por ejemplo Aldus PageMaker, el cual incluye versiones de Lorem Ipsum.</p> 
</div>

[marcosnc_08]

Bueno con eso me solucionaste gran parte del los problemas, gracias.
Lo unico que queda es que la imagen se ve con un fondo blanco mientras que en el archivo original el fondo es transparente.

[willyfc]

esa imagen es un png transparente no se tienes el hack para IE6 siempre con ese fondo, esa es otra falencia del ie6 no los sabe interpretar

mira el código fuente de esta web que hizo Mikmoro y podrás resolverlo

http://araudi.net/ejemplos/png_para_IE.html

[willyfc]

y aquí otra forma de arreglarlo

pero tendrás que ponerlo de fondo del div no sobre el html

#logo {
margin:15px 0 0 70px;
width: 700px;
height: 100px;
background-image: url(css/logo/logo.png) !important;
background-image: none;
filter: none !important;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='css/logo/logo.png');
}

avisas como te va

[marcosnc_08]

Ya me funciona, Muchas gracias por la ayuda.

[willyfc]

Iniciado por marcosnc_08

Ya me funciona, Muchas gracias por la ayuda.

acabo de ver tu web en http://expomadero.webcindario.com/prueba/ y el problema de png transparente persiste, se sigue viendo el fondo celeste

[marcosnc_08]

Lo que pasa es que no la subi de nuevo al servidor pero ya me fije con mi PC y anda.

Lo que falla es que cuando se ve la trasparencia en el IE, en el Firefox no se ve la imagen .png.

[willyfc]

Iniciado por marcosnc_08

Lo que falla es que cuando se ve la trasparencia en el IE, en el Firefox no se ve la imagen .png.

y como colocaste el código para mostrar el png

[marcosnc_08]

Disculpame la tardanza.

Lo copie tal cual vos lo posteaste.

[willyfc]

definitivamente no se ve bien, muestrame como pusiste el código para el png transparente

[marcosnc_08]

Bueno lo subi con el codigo css que me diste.

La direccion nueva es: http://marcosnc_08.freexa.com.ar

Esta ves el index es ".php"

Fijate aber si cometi algun error.
Gracias.

[willyfc]

se ve bien, todo esta donde debe estar estoy viendola en chrome, IE6,ff y se casi perfectamente igual, te felicito supiste acoplar bien el código,

pero no veo el png transparente de tu cabeceram

[marcosnc_08]

Bueno lo que pasa es que puse el codigo css que me diste para que se vea la trasparencia del "png" de la pagina. Pero la imagen no aparece.

[willyfc]

tienes que colocar el div logo dentro del header

Código HTML:

<div id="header">
     <div id="logo"></div>
</div> 

y asegurate de que la ruta de img sea la correcta.

[marcosnc_08]

Jajaja, nose como me equivoque, eso que la hice yo xd!!

Bueno ahora la ruta es correcta y el codigo css es correcto. Pongo el IE se ve todo de maravilla.

Pongo el Mozilla querido, comienza todo bien, los scripts php funcionan a la perfeccion pero... la imagen no esta, no la reproduce.

Nose, ¿tenes idea?

Gracias.