Mon texte ne s'affiche pas

Résolu
Bonjour,

Je code une petite page en html mais une partie ne veut pas s'afficher.
Tout fonctionne sauf la partie "essai"
Quelqu'un a-t-il une idée de mon erreur ? Merci

Voici le code de la page :

<!DOCTYPE html>
<html lang="en" >
    <head>
        <meta charset="utf-8" />
        <title>Titre de la page</title>

        <link rel="stylesheet" href="css_1.css" type="text/css" media="screen">
        <link rel="stylesheet" href="css_2.css" type="text/css" media="screen">
    </head>
    <body>
        <div class="container">
            <div class="content">

                <ul id="nav">
                    <li><a href="#">Element liste 1</a></li>
                    <li><a href="#" class="current">Element liste 2</a>
                        <ul class="subs">
                            <li><a href="#">Sous élément 1</a></li>
                            <li><a href="#">Sous élément 2</a></li>
                            <li><a href="#">Sous élément 3</a></li>
                            <li><a href="#">Sous élément 4</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
  
  <div class="essai">
   <p> Pourquoi ce texte ne d'affiche pas ???? </p>
  </div>

        <footer>
            <h2>Année 2015-2016</h2>
            <a> Projet de l'année </a>
        </footer>
    </body>
</html>


Voici css_1 :

*{
    margin:0;
    padding:0;
}
body {
    background-color:#bababa;
    color:#fff;
    font:14px/1.3 Arial,sans-serif;
}
footer {
    background-color:#212121;
    bottom:0;
    box-shadow: 0 -1px 2px #111111;
    display:block;
    height:70px;
    left:0;
    position:fixed;
    width:100%;
    z-index:100;
}
footer h2{
    font-size:22px;
    font-weight:normal;
    left:50%;
    margin-left:-400px;
    padding:22px 0;
    position:absolute;
    width:540px;
}
footer a.stuts,a.stuts:visited{
    border:none;
    text-decoration:none;
    color:#fcfcfc;
    font-size:14px;
    left:50%;
    line-height:31px;
    margin:23px 0 0 110px;
    position:absolute;
    top:0;
}
footer .stuts span {
    font-size:22px;
    font-weight:bold;
    margin-left:5px;
}
.container {
    background:url("orn.png") repeat-x top left;
    border-top: 5px solid #000000;
    height: 600px;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.content {
    margin:0 auto;
    width:900px;
}
.essai {
 color: #232223;
    display:block;
    float:right;
    font: 16px/26px Georgia,"Times New Roman",Times,serif;
}


Et css_2:

ul#nav {
    color: #232223;
    display:block;
    float:right;
    font: 16px/26px Georgia,"Times New Roman",Times,serif;
}
ul#nav,ul#nav ul {
    list-style:none;
}
ul#nav .subs {
    background-color: rgba(121,160,160,0.8);
    border:1px solid #887963;
    display:none;
    float:left;
    left:0;
    padding:10px;
    position:absolute;
    top:100%;
}
ul#nav li:hover>* {
    display:block;
}
ul#nav li:hover {
    position:relative;
}
ul#nav ul .subs {
    left:100%;
    position:absolute;
    top:0;
}
ul#nav ul {
    padding:0 5px 5px;
}
ul#nav li {
    display:inline;
    float:left;
}
ul#nav a {
    color: #353435;
    float: left;
    font-size: 15px;
    letter-spacing: 1px;
    line-height: 14px;
    min-width:60px;
    padding: 60px 20px;
    text-align: center;
    text-decoration: none;
    text-shadow: 1px 1px 0 #B4C6C6;
    text-transform: uppercase;
}
ul#nav > li:hover > a {
    border-top: 5px solid #887963;
    color: #1e1e1e;
    padding-top: 55px;
}
ul#nav li a.current, ul#nav li a.current:hover {
    background: url("current.png") no-repeat scroll center top transparent;
    border: medium none;
    color: #fff;
    padding-top: 60px;
    text-shadow: none;
}
ul#nav ul a {
    color:#000;
    font-size:12px;
    font-weight:bold;
    padding:5px;
    text-shadow:#fff 0 0 0;

    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
}
ul#nav ul li:hover>a {
    letter-spacing:2px;
}

3 réponses

  1. Bonsoir, merci de répondre aussi vite, j'utilise chrome
    Voici ce que j'ai :

    1. Je viens d'essayer avec internet explorer mais le problème reste le même
  2. Bonsoir. Chez moi la partie essai s'affiche. Tu peux nous montrer un screenshot de ta page web vue de ton navigateur?
    D'ailleurs, quel(s) navigateur(s) utilises-tu? Mis à jour?
    1. Et mon navigateur est a jour
  3. Bah... Vérifie que tes navigateurs soient à jour.
    Parce-qu'ua niveau code, je ne vois rien d'anormal. Et chez moi, ça donne ça :
    1. Merci de ton aide je viens de résoudre le problème, le cadre fictif de ma liste était trop grand, cf : css_2 :

      .container {
          background:url("orn.png") repeat-x top left;
          border-top: 5px solid #000000;
          height: 600px;


      Il suffisait de mettre 200px au lieu de 600