Mi CSS no funciona en Explorer

blakmetall · #1 (**permalink**) 31/01/2011, 18:11

Amigos necesito su ayuda con mi codigo CSS

Lo que pasa es que funciona perfectamente en Mozilla.
Pero en Explorer no funciona nada tan solo el menu y solo los links del menu.
La verdad soy relativamente nuevo al css y no se mucho aun, ando viendo documentacion de eso. pero por lo pronto alguien me podria ayudar.

este es mi codigo HTML:

Código HTML:

Ver original<!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=iso-8859-1" />
   <title>Sistema</title>
    <link href="css/style.css" rel="stylesheet" type="text/css" />
     <script type="text/javascript" src="js/main.js"></script>
</head>
 
<body>
<table>
<tr>
    <div id="header">
 
    </div>
</tr>
<tr>
    <table class="content">
        <tr>
        <div id="subject">
            <ul class="link">
                <li><a href="index.php"> Inicio </a></li>
                <li><a href="alta.php"> Altas </a></li>
                <li><a href="baja.php"> Bajas </a></li>
                <li><a href="actualizacion.php"> Modificaciones </a></li>
                <li><a href="reportes.php"> Reportes </a></li>
                
                <div>
                    <li><a href="menu1.php" class="menuLink">Expedientes</a>
                    <ul class="menus" id="menu1">
                        <li><a href="archivosUp.php"> Subir </a></li>
                        <li><a href="archivosDown.php"> Bajar </a></li>
                    </ul>
                    </li>
                </div>
                
                <div>
                    <li><a href="menu2.php" class="menuLink">Respaldos</a>
                    <ul class="menus" id="menu2">
                        <li><a href="restaurar.php"> Restaurar </a></li>
                        <li><a target="_blank" href="guardar.php"> Guardar </a></li>
                    </ul>
                    </li>
                </div>
            </ul>
        </div>
        </tr>
        <tr>
        <div id="content">
         Contenido
        </div>
        </tr>
    </table>
</tr>
</tr>
 
</table>
 
</body>
</html>

y este es mi css:

Código CSS:

Ver originalhtml {
    height: 100&#37;; 
    width: 100%; 
}
    
body { 
    height: 100%; 
    width: 100%; 
    margin: 0; 
    padding: 0; 
    border: 0; 
    background: #FFFFFF;
   font: 13px Verdana,Arial,Helvetica,sans-serif; 
}
 
div {
    width: 180px;   
    float: left;
}
 
div#header { 
    height: 100%; 
    width: 100%; 
    height: 200px; 
    text-align: center; 
    background: #F4FA58; 
    font-size:30px;
}
 
div#subject { 
    font-weight: bold;
    line-height: 35px;
    height: 100%; 
    width: 18%; 
    text-align: left; 
    background: #084B8A; 
    font-size:15px;
}
 
div#subject a{
    text-decoration: none;
}
 
div#content { 
    height: 100%; 
    text-align: center; 
    font-size:20px;
}
 
ul{
    list-style-type: none;
}
 
#posicion {
    height: 600px;
}
 
#content {
    
}
 
ul.link li{
    color: #FFFF00;
}
 
 
ul.link a{
    color: #FFFF00;
}
 
input.invalid {
    background-color: #FF9;
    border: 2px red inset;
}
 
select.invalid{
    background-color: #FF9;
    border: 2px red inset;
}
 
ul#menu1, ul#menu2 {
    display: none;
    line-height: 25px;
    margin: 0;
    margin-left: 20px; 
    padding: 0;
    font-weight: normal;
 
}
 
a.menuLink, li a {
    text-decoration: none;
    color: #FFFF00;
 
}
 
li a:hover {
    background-color: #FF0000;
    /*color: white;*/
}
 
dl#archivosUp {
    position:absolute;
    top:250px;
    left:400px;
}
 
/* EXPEDIENTES */
 
table#tablaExpedientes {
    position:absolute;
    top:300px;
    left:500px;
}
 
table#tablaExpedientes tr th {
    background: #084B8A; 
    color:#F4FA58;
    font-size:15px;
    padding:20px;
}
 
table#tablaExpedientes tr td {
    background: #F3F781; 
    color:#F4FA58;
    font-size:12px;
    padding:5px;
}
 
table#tablaExpedientes a {
    color: blue;
    text-decoration: none;
}
 
table#tablaExpedientes tr td {
    color: blue;
    text-decoration: none;
}
 
table#reportes{
    position:absolute;
    top:220px;
    left:500px;
}
 
#reportes th{
    color:#084B8A;
    font-size:15px;
    padding:5px;
}
 
#reportes th#error{
    color:red;
    font-size:12px;
}
 
table#generador{
    border-color: blue;
    position:absolute;
    top:400px;
    left:205px;
    font-size:12px;
    background: #084B8A; 
}
 
#generador  td{
    color: #084B8A;
    text-decoration: none;
    background: #F3F781; 
    padding:2px;
}
 
#generador th{
    height: 30px;
}
 
#generador a{
    color:#F4FA58;
    font-size:14px;
    padding:2px;
}

De antemano Gracias por todas sus respuestas

ArturoGallegos · #2 (**permalink**) 31/01/2011, 18:50

creo que es un milagro que FF te muestre bien tu html

andas mal en una tabla no se estructura de esa forma

esto esta mal

Código HTML:

Ver original<table>
    <tr>
        <div></div>
    </tr>
</table>

esto esta bien

Código HTML:

Ver original<table>
    <tr>
        <td></td>
    </tr>
</table>

sanxuan · #3 (**permalink**) 31/01/2011, 19:00

Puedes validar el HTML en htpp://validator.w3.org.
Un código que no pasa la validación no tiene ninguna garantía de mostrarse correctamente.

blakmetall · #4 (**permalink**) 31/01/2011, 19:38

Wow amigos muchisimas gracias eso es un error increiblemente tonto. yo pense que era problema de css por que si valia en firefox.

Y tambien voy a ver eso de validar HTML no sabia que existia tal cosa.

Gracias por todo

moises9633 · #5 (**permalink**) 01/02/2011, 10:20

Cita:

Iniciado por sanxuan

Puedes validar el HTML en htpp://validator.w3.org.
Un código que no pasa la validación no tiene ninguna garantía de mostrarse correctamente.

no te entendí muy bien no se mucho sobre este tema me podrías explicar un poco mejor gracas

ArturoGallegos · #6 (**permalink**) 01/02/2011, 12:06

Cita:

Iniciado por moises9633

no te entendí muy bien no se mucho sobre este tema me podrías explicar un poco mejor gracas

que parte del problema y las soluciones no entendiste? visitaste el link del compañero -> http://validator.w3.org/

por si no lo has hecho y probado en este sitio colocas el link a tu sitio y valida el codigo que tenga una sintaxis correcta... como le a ocurrido al compañero puede haber errores en tu código que no permiten se visualice correctamente en todos los navegadores

moises9633 · #7 (**permalink**) 01/02/2011, 12:15

Cita:

Iniciado por Ag666

que parte del problema y las soluciones no entendiste? visitaste el link del compañero -> http://validator.w3.org/

por si no lo has hecho y probado en este sitio colocas el link a tu sitio y valida el codigo que tenga una sintaxis correcta... como le a ocurrido al compañero puede haber errores en tu código que no permiten se visualice correctamente en todos los navegadores

aaa ok no sabia eso mira lo que me aparecio

Código PHP:

  Errors found while checking this document as XHTML 1.0 Transitional!
Result:     21 Errors

Código PHP:

  Line 142, Column 33: there is no attribute "STYLE"
<div class="smallfont"><a STYLE="text-decoration:none" href="http://www.comunid…

Código PHP:

   Line 142, Column 185: required attribute "alt" not specified
&#8230;s.com/ImagenesW/home.png" width="19" border="0" height="19" /> Inicio</a></div>

Código PHP:

  Line 145, Column 193: required attribute "alt" not specified
&#8230;m/ImagenesW/newsII.png" width="19" border="0" height="19" /> Noticias</a></div>

Código PHP:

  Line 152, Column 192: required attribute "alt" not specified
&#8230;om/ImagenesW/movies.png" width="19" border="0" height="19" /> Videos </a></div>

Código PHP:

  Line 155, Column 303: required attribute "alt" not specified
&#8230;/1283360546_ark2.png" width="19" border="0" height="19" /> Descargas </a></div>

etc...
tengo que corregir todo eso ?

ArturoGallegos · #8 (**permalink**) 01/02/2011, 12:19

si deseas un código valido y que se vea correcto en cualquier navegador SIIII

pero a la de ya... especialmente

Cita:

Line 142, Column 33: there is no attribute "STYLE"
<div class="smallfont"><a STYLE="text-decoration:none" href="http://www.comunid…

estas usando xhtml y todas las propiedades y atributos deben ir en minúsculas, tu has escrito STYLE y debe ser style

Nota: es mejor usar una clase dentro de una hoja de estilo en lugar de aplicar el css directamente sobre el objeto en cuestión