La communauté ALL HTML c'est 60442 membres à ce jour dont 0 inscrits aujourd'hui et 5 depuis une semaine.

  • imprimer
  • aide

Forum de discussions « XHTML - HTML - CSS »

Retrouvez les publications relatives à ces discussions dans nos rubriques CSS, HTML, XHTML.

Adapter le nombre de colonnes d'un tableau en CSS

liste des forums liste des discussions Participer à la discussion

Photo de electroremy Message publié le samedi 21 novembre 2009 à 19 h 12 par electroremy.
Bonjour,

est-il possible de faire ça en CSS (sans javascript) :

http://electroremy.free.fr/sonorama2009/part20.html

sur ce site le nombre de colonnes du tableau s'adapte à la fenêtre du navigateur pour que la page soit remplie et qu'il n'y ai pas de barre de défilement horizontale mais seulement verticale pour la navigation

je ne tiens pas absolument à utiliser des tableaux; s'il est possible de présenter des vignettes bien alignées qui occupent la largeur de la page ça me va

merci
Photo de electroremy Message publié le dimanche 22 novembre 2009 à 00 h 32 par electroremy.
Bonsoir,

J'ai trouvé une façon de faire qui correspond presque à ce que je veux; les DIV utilisent judicieusement l'espace en adoptant le bon nombre de colonnes. Mais je n'arrive pas à centrer l'ensemble des DIV.PIC, ce qui est très laid.

Voici les codes :

fichier html :

<HTML>
<HEAD>
<style type="text/css">
@import url(style_p.css);
</style>
<TITLE>Vidéos</TITLE>
</HEAD>
<BODY>
<div class="int">
<div class="pic">boite 1</div>
<div class="pic">boite 2</div>
<div class="pic">boite 3</div>
<div class="pic">boite 4</div>
<div class="pic">boite 5</div>
<div class="pic">boite 6</div>
<div class="pic">boite 7</div>
<div class="pic">boite 8</div>
</div>
</BODY>
</HTML>

fichier css :

div.pic {float: left;
width: 250px;
height: 180px;
background: #ff9933;
margin: 12px 12px 12px 12px;
padding: 6px 6px 6px 6px;
border-style: dashed;
border-width: medium;
border-color: green;
text-align: center;
vertical-align: middle;
}

div.int {margin-left: auto;
margin-right: auto;
margin-top: 4%;
margin-bottom: 4%;
text-align: center;
}

Comment faire ? Sachant que je ne peux connaitre le width à appliquer à div.int puisque cette valeur dépend de la taille de la fenêtre du navigateur du visiteur du site.

Merci !

liste des forums liste des discussions Participer à la discussion

Vous devez obligatoirement vous identifier en tant que membre pour participer à cette discussion.

ACCÉS COMMUNAUTÉ

Rejoignez ALL HTML

Publiez vos articles, actualités, communiqués ... Donnez votre avis, partagez votre réseau, rencontrez d'autres membres et participez à la vie de la communauté.

Les 5 dernières discussions