HTML/CSS - Supprimer les espaces de sauts de ligne dans le code pour LI

Hey,
Est-il possible d'obtenir des navigateurs pour ignorer les sauts de ligne dans le code source?

<div id="navbar">
    <div id="navbar-container">
        <ul>
            <li>HOME</li>
            <li>TUTORIALS</li>
            <li>BLOG</li>
            <li>FORUMS</li>
            <li>LINKS</li>
            <li>&nbsp;</li>
        </ul>
    </div>
</div>

#navbar {
    background:#FFF;
    width:940px;
    margin:auto;
    border-radius: 10px 10px;
    -webkit-box-shadow: 5px 5px 10px #888;
}
#navbar-container {
    margin:auto;
}
#navbar-container ul {
    list-style:none;
    text-align:center;
    display:block;
    width:auto;
    padding:0;
    margin:0;
}
#navbar-container li{
    list-style:none;
    border-left:3px solid black;
    display:inline-block;
    font-family:"Arial", sans-serif;
    font-size:2em;
    padding:0 7px 0 10px;
    margin:0;
    white-space:nowrap;
}
#navbar-container li:hover{
    color:#FFF;
    background:#000;
    border-left:3px solid black;
    display:inline-block;
    font-family:"Arial", sans-serif;
    font-size:2em;
    margin:0;
    padding:0 7px 0 10px;
}

C'est de placer un petit espace entre chaque LI, je l'ai mis en place alors la ligne à l'horizontale,
je pouvais seulement de supprimer les sauts de ligne dans la source, mais l'id préfèrent ne pas.

InformationsquelleAutor Diesal11 | 2010-10-10
  1. 10

    Vous pouvez flotter (soit left ou right), ou vous pouvez commentaire-les espaces:

    <ul>
  <li>...</li><!--
  --><li>...</li>
</ul>

    Ou simplement laisser les balises ouvertes jusqu'à la ligne suivante.

    <ul>
  <li>...</li
  ><li>...</li
  ><li>...</li>
</ul>
    • Agh, me battre pour la balise d'ouverture de la solution. Je n'ai jamais vu un problème dans n'importe quel navigateur, outre IE.
    • l'laissant les balises open solution travaillé, ill vous donner la réponse que vous a donné la solution en premier. merci!
    • C'est un de mes favoris =)
    • jouer avec la marque jusqu'à TORT assurez-vous d'utiliser le "float" la méthode!
    InformationsquelleAutor David Thomas
  2. 2

    IE semble faire un hold-de l'époque où les éléments de la liste n'ont pas de balises de fermeture. Une façon courante est de mettre la fermeture > sur la ligne suivante, c'est à dire

    <ul>
        <li>HOME</li
        ><li>TUTORIALS</li
        ><li>BLOG</li
        >etc...
    InformationsquelleAutor jball
  3. 0

    Tous les navigateurs devraient ignorer totalement l'espace. Est-il un navigateur particulier problème?

    Essayer:

    li { margin: 0; padding: 0 }
    • c'est sur eux tous, j'ai déjà mis la marge à 0 et le remplissage de chaque côté est de fournir le texte de l'espace, la mauvaise mise à jour de la question avec les CSS
    • Ils ne sont pas 'ignorer' "espace blanc", ils ont simplement le réduire à un seul espace. Ce qui est exprimé comme une pause entre les lis lors de l'affichage en ligne. Si elles sont émises, il est alors ignoré.
    • Alors peut-être une meilleure approche serait d'obtenir en quelque sorte à le traiter comme un espace plutôt qu'un br... je sais que cela aurait rendu ma vie beaucoup plus facile un peu de temps si je pouvais avoir compris comment.
    InformationsquelleAutor Explosion Pills
  4. 0

    Je me demandais la même chose et ce qui a fonctionné pour moi a été:

    li { display: table-cell; }

    Toutes les pauses sont ignorés et maintenant mes boutons de menu sont juste à côté les uns des autres.

    Vous pouvez voir un exemple ici sur mon site de musique: http://www.yanike.tk

    J'ai utilisé un Sprite CSS sur mon UL LI pour mon menu de navigation (accueil, médias,...).

    InformationsquelleAutor yanike