Problemas con el CSS

Hola, estoy cambiando un poco mi web y tengo algun problemilla con el CSS, a ver si me podeis ayudar. Iba todo bien hasta que ha insertado la capa #tartaro y he puesto dentro una tabla para poner los enlaces. En IE se ve bien pero en Opera y Firefox me deja un hueco arriba hasta que empieza la imagen de fondo de #aqueronte, que es lo que sera la web, ademas me pone la tabla con los enlaces arriba, cuando quiero que vayan abajo. Tiene toda la pinta de que sean los 570 px que he puesto de margin-top, como lo puedo arreglar?
No se si me he explicado bien :wacko: , aqui esta la hoja de estilos a ver si veis algo
Gracias

<!--c1--><div class='codetop'>CÓDIGO</div><div class='codemain'><!--ec1-->body {
&nbsp;&nbsp;&nbsp;&nbsp;background-color: #000000;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0px;
}
#estigia {
&nbsp;&nbsp;&nbsp;&nbsp;height: 650px;
&nbsp;&nbsp;&nbsp;&nbsp;width: 100%;
}
#estigia #aqueronte {
&nbsp;&nbsp;&nbsp;&nbsp;background-image: url(demons/fondollaves.jpg);
&nbsp;&nbsp;&nbsp;&nbsp;background-repeat: no-repeat;
&nbsp;&nbsp;&nbsp;&nbsp;height: 650px;
&nbsp;&nbsp;&nbsp;&nbsp;width: 1000px;
&nbsp;&nbsp;&nbsp;&nbsp;margin-right: auto;
&nbsp;&nbsp;&nbsp;&nbsp;margin-left: auto;
}
#estigia #aqueronte #tartaro {
&nbsp;&nbsp;&nbsp;&nbsp;height: 50px;
&nbsp;&nbsp;&nbsp;&nbsp;width: 800px;
&nbsp;&nbsp;&nbsp;&nbsp;margin-top: 570px;
&nbsp;&nbsp;&nbsp;&nbsp;margin-right: auto;
&nbsp;&nbsp;&nbsp;&nbsp;margin-left: auto;
} <!--c2--></div><!--ec2-->

 

akhkham puedes subirla para ver lo que estas haciendo¿?

has oido hablar de la etiqueta float y display¿?.. con ellas puedes montar las cosas sin tener que ir todos esos anchos y altos¿?

 

Esto es lo que quiero hacer, pero no se por que la capa amarilla tiene margen superior (menos en IE que se ve bien)

<a href="http://www.elinfiernoespera.com/prueba.html" target="_blank">http://www.elinfiernoespera.com/prueba.html</a>

Las propiedades de flotar y borrar las conozco pero creo que no me hacen falta, lo de display no se que es

 

HOla, en IE8 tampoco se ve bien, el error es muy sencillo si colocas una capa con margen dentro de otra capa que no tenga padding, el margen no respetara al div que lo contiene sino que lo sobrepasara ( por eso ves ese margen superior tan grande )
La solucion es muy simple:
<!--c1--><div class='codetop'>CÓDIGO</div><div class='codemain'><!--ec1-->
#todo #container {prueba.html (línea 15)
background-color:#FFFF00;
height:650px;
margin-left:auto;
margin-right:auto;
margin-top:0;
padding-top:1px;
width:1000px;
}
<!--c2--></div><!--ec2-->

 

creo que Logus te da la solución; eso parece que es

la capa todo me parece imnecesaria, con la capa content puedes definir la posición de esta y la capa todo lo unico que dice es que tenga un 100%de ancho

 

Gracias por la ayuda, voy a ver si ahora sale

 

Bueno, ya va saliendo. Otra cosa, sobre el aspecto de los vinculos esta vez. Los he aplicado desde propiedades de pagina, si voy a hacer una nueva regla no se hacerlo. Ahora que tengo que hacer, pegar esto en la hoja de estilos?¿Y si solo quiero aplicar esto a una capa lo pego dentro de la capa y ya esta?
Gracias

<!--c1--><div class='codetop'>CÓDIGO</div><div class='codemain'><!--ec1--><style type="text/css">
<!--
a:link {
&nbsp;&nbsp;&nbsp;&nbsp;color: #CCCCCC;
&nbsp;&nbsp;&nbsp;&nbsp;text-decoration: none;
}
a:visited {
&nbsp;&nbsp;&nbsp;&nbsp;text-decoration: none;
&nbsp;&nbsp;&nbsp;&nbsp;color: #CC6600;
}
a:hover {
&nbsp;&nbsp;&nbsp;&nbsp;text-decoration: none;
&nbsp;&nbsp;&nbsp;&nbsp;color: #CC6600;
}
a:active {
&nbsp;&nbsp;&nbsp;&nbsp;text-decoration: none;
&nbsp;&nbsp;&nbsp;&nbsp;color: #CC6600;
}
-->
</style> <!--c2--></div><!--ec2-->

 

sí quieres que los estilos se apliquen solo a una capa especificas haces algo así, imaginate que sea, que quieres que solo se apliquen a la capa contenido, por ejemplo.. haces esto

#contenido a:link {
color: #CCCCCC;
text-decoration: none;
}

tendrías que hacer eso con cada estilo

sí, sobre lo que tendrías que hacer con esos estilos que tienes generados desde propiedades de la página, es cortarlos y pegarlos en la hoja de estilos

 

He visto que se puede tambien hacer estilos en una pagina y luego exportarlos a una hoja, voy a probarlo. Gracias por la ayuda opinguino

 

Mas problemas :huh: No se como centrar verticalmente las div PA que voy a hacer para la galeria. Las centro horizontalmente y abren y cierran pero la capa se pone encima del div que contiene la web. He probado con margenes top y demas pero no lo consigo, me queda asi
<!--c1--><div class='codetop'>CÓDIGO</div><div class='codemain'><!--ec1-->http://www.elinfiernoespera.com/div.html<!--c2--></div><!--ec2-->
Otra cosa aunque menos importante, quiero poner un marco a los thumbs de la galeria pero si le doy las propiedades a las imagenes me pone marco a todas, y si las propiedades las doy dentro de un div me descuadra todo, a ver si me echais una mano
Gracias

 

No existe centrar Verticalmente. (PUNTO dije)

 

usa margenes para "centrar" verticalmente.. es algo complicado pues dependes mucho de las resolucciones de pantalla y sobre todo de todas las barritas que tenga el usuariuo instaladas en su navegador.. yo trato de separarla un poco por arriba con márgenes y luego dar un margen inferior tambien; todo esto a la capa pricipal contenedora de todo y no me preocupo mucho más

 

<!--quoteo(post=345377:date=Nov 6 2008, 11:55 PM:name=elQuique)--><div class='quotetop'>CITA(elQuique @ Nov 6 2008, 11:55 PM) [snapback]345377[/snapback]</div><div class='quotemain'><!--quotec-->
No existe centrar Verticalmente. (PUNTO dije)


<!--QuoteEnd--></div><!--QuoteEEnd-->
Ya, pero me referia a que quedase centrada sobre la capa que contiene la web

Despues de intentarlo de varias formas creo que le voy a dar el 100% de ancho y ya esta. El problema de las imagenes a ver si lo puedo hacer aplicando un estilo

 

En realidad hay trucos para hacerlo, debes usar margenes y padding, indicas alturas vijas para el DIV a centrar y le das un margen - 50%, alineación TOP y relativa.

 

La tengo casi hecha, ya me direis si hay que retocar algo pero estoy bastante contento

 

en general lo veo bastante bien..

hay algunos errores en el código; que hace que la web no valide, pero yo creo que casi todos son arreglables; con paciencia y calma

yo valido directamente desde la Webdeveloment toolbar para firefox.. gratis

 

Lo tengo instalado desde hace unos dias pero no se que hacer con el

 

en la parte de tools vienen las opciones de validar; puede hacerlo desde tu archivo en el pc (entonces le das a la opcion de validar local) o en web le das simplemente a validar HTML

yo te diría que experimentases con ella, vallas probando apra que es cada cosa, pues son bastante específicas.

generalmetne las que mas uso son todas las de la parte de tools, la de redimensionar, ver codigo (para alguna página que quiero ver) y luego la parte de imagenes para comprobar como se ven las cosas sin imagenes, si me olvide de algún alt o puse mal el texto del alt y la parte de CSS para ver los estilos