Je veux avoir une ligne de divs (cellules) qui n'emballe pas si le navigateur est trop étroit pour s'adapter à eux.
J'ai cherché de la Pile, et ne pouvait pas trouver de travail, de répondre à ce que je pense devrait être une simple css question.
Les cellules ont une largeur spécifiée. Mais je ne veux pas de spécifier la largeur de la ligne, la largeur doit automatiquement à la largeur de son enfant cellules.
Si la fenêtre est trop étroite pour accueillir les lignes, puis la div doit débordement avec des barres de défilement.
Veuillez indiquer votre réponse en tant que travail extrait de code, que j'ai essayé beaucoup de solutions que j'ai vu ailleurs (comme préciser width: 100% et ils ne semblent pas fonctionner).
Je suis à la recherche d'un code html/css seule solution, pas de javascript.
<html>
<body>
<style>
.row {
float:left;
border: 1px solid yellow;
width: 100%;
overflow: auto;
}
.cell {
float: left;
border: 1px solid red;
width: 200px;
height: 100px;
}
</style>
<div class="row">
<div class="cell">a</div>
<div class="cell">b</div>
<div class="cell">c</div>
</div>
</body>
</html>
Pour le moment, je suis en train de coder en dur la largeur de la ligne à un grand nombre.