Простой стиль CSS не работает на IE, но да, в любом другом браузере

Question

У меня есть простой CSS-файл с именем Titulos.css , который содержит это:

h1 {    font: 50px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #111; text-shadow: 0px 2px 3px #555;    }
h2 {    font: 14px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #CCC; text-shadow: 0px 1px 2px #555;    }
h3 {    font: 10px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #CCC;   }
b1 {    font: 16px Tahoma, Helvetica, Arial, Sans-Serif; color: #DDD;   }
b2 {    font: 10px Tahoma, Helvetica, Arial, Sans-Serif; color: #F9F7ED;    }
.caja {  width: 690px; height: 40px; background-color: transparent; border: 0px solid #000000; font-size:x-large; color: #222; font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; font-weight: bold;" size="299";  }
.style1 {   text-align: right; }

И страницу, которая вызывает этот файл как:

<link rel="stylesheet" type="text/css" href="LIB/titulos.css" />

Далее на этой странице я пытаюсь использовать некоторые из стилей, таких как:

<div id="todo" align="center" >
    <div id="cabeza" style="width:850px;height:100px">
    </div>
    <div id="contenido" style="width:850px;height:420px;background-image: url(IMG/cuadro.png)" >
        <div id="titulo" style="width:765px;height:75px;padding-top: 18px;margin: auto;text-align: left;">
            <b1>Bienvenido <b><?php echo($username); ?></b></b1><br>
            <?php $check = mysql_query("SELECT * FROM sms WHERE ref = '".$username."' ORDER BY fecha DESC LIMIT 0, 1") or die(mysql_error());
            while($info = mysql_fetch_array( $check )) { 
                echo("<b1> Tu ultimo mensaje enviado fue: </b1><b2>" . $info['texto'] . " enviado el " . $info['fecha'] . "</b2>");

Что, разумеется, только часть кода, Firefox и Chrome отображают приведенный выше код следующим образом: alt text http://img31.imageshack.us/img31/8814/bieng.jpg что, как вы видите, применены стили.Но когда я вижу код из IE 8 (даже 7 или 6), это то, что вы видите: alt text http://img268.imageshack.us/img268/8132/malcu.jpg Итак, что вы думаете?

Answer 1

<b1> и b2 не являются элементами html.Современные браузеры (Firefox, Chrome и т. Д.) Автоматически обнаруживают их и применяют к ним правила css (как обнаружение ошибок), но Internet Explorer не может применить правила css, поскольку они не являются тегами html.

Я предлагаю вам заменить<b1> & <b2> с реальными тегами (и использовать классы для css), или, если вы хотите взломать, вставьте document.createElement("b1");document.createElement("b2") в скрипт.Это заставит IE7 и 8 применять правила CSS.

Пример:

    h1 {    font: 50px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #111; text-shadow: 0px 2px 3px #555;    }
    h2 {    font: 14px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #CCC; text-shadow: 0px 1px 2px #555;    }
    h3 {    font: 10px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #CCC;   }
    /* classes */
    .b1 {    font: 16px Tahoma, Helvetica, Arial, Sans-Serif; color: #DDD;   }
    .b2 {    font: 10px Tahoma, Helvetica, Arial, Sans-Serif; color: #F9F7ED;    }
    .caja {  width: 690px; height: 40px; background-color: transparent; border: 0px solid #000000; font-size:x-large; color: #222; font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; font-weight: bold;" size="299";  }
    .style1 {   text-align: right; }

и:

<div id="todo" align="center" >
    <div id="cabeza" style="width:850px;height:100px">
    </div>
    <div id="contenido" style="width:850px;height:420px;background-image: url(IMG/cuadro.png)" >
        <div id="titulo" style="width:765px;height:75px;padding-top: 18px;margin: auto;text-align: left;">
<!-- assuming headers -->
            <h1 class="b1">Bienvenido <b><?php echo($username); ?></b></h1><br>
            <?php $check = mysql_query("SELECT * FROM sms WHERE ref = '".$username."' ORDER BY fecha DESC LIMIT 0, 1") or die(mysql_error());
            while($info = mysql_fetch_array( $check )) { 
                echo("<h1 class='b1'> Tu ultimo mensaje enviado fue: </h1><h2 class='b2'>" . $info['texto'] . " enviado el " . $info['fecha'] . "</h2>");