94 votes

CSS pas d'habillage de texte

Veuillez voir le code http://jsbin.com/eveqe3/edit également cité ci-dessous.

J'ai besoin d'afficher du texte à l'intérieur des divs d'éléments de telle sorte que le texte n'apparaisse que dans la boîte verte avec la largeur spécifiée, le reste de la ligne doit être caché. N'importe quelle suggestion s'il vous plaît...

<style>
  #container{
    width : 220px;
  }
  .item{
    float:left;
    border: 1px solid #0a0;
    width: 100px;
    height: 12px;
    padding 2px;
    margin: 0px 2px;
  }
  .clearfix{
    clear: both;
  }
</style>
</head>
<body>
  <div id="container">
    <div class="item"> A very loooooooooooooooooooooong text </div>
    <div class="item"> Another looooooooooooooooooooong text </div>
    <div class="clearfix">  </div>
   </div>
</body>
</html>

231voto

xor_eq Points 1197

En plus de overflow:hidden, utilisez

white-space:nowrap;

32voto

Macmade Points 27414

Il suffit d'utiliser :

overflow: hidden;
white-space: nowrap;

Dans les divs de votre article

3voto

dejavu Points 1648

Utilisez la propriété css overflow . Par exemple :

  .item{
    width : 100px;
    overflow:hidden;
  }

La propriété overflow peut avoir une des nombreuses valeurs comme ( caché , défilement , visible ) vous pouvez aussi contrôler le débordement dans un seul sens en utilisant débordement-x o débordement-y .

J'espère que cela vous aidera.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X