css inline-block vs table-cell
Quelles sont les différences entre les inline-block et table-cell?
J'ai trouvé ces deux styles sont les mêmes. Quel que soit le style que vous par exemple. text-align: center; vertical-align: middle; etc. en identifiant display: inline-block; ou display: table-cell; serait la même.
Veuillez en aviser les principales différences.
Vous devez vous connecter pour publier un commentaire.
display: table-celletdisplay: inline-block;confondons le même, mais il a une énorme différence entre eux.display: inline-block;ne se comportera pas comme lesdisplay: table-cell;c'est à dire inline-block se comportent comme le niveau de bloc lorsque votre navigateur sera ré-taille plus grande ou si votre contenu dépasse de sa largeur, tandis quedisplay: table-cell;ne sera pas.Vous pouvez voir les différences entre eux ici
Vous trouverez également l'écart entre le bloc lorsque vous appliquez
display: inline-block;Re-de la taille de votre fenêtre en appuyant sur la touche Ctrl et le défilement avec la souris bouton de défilement pour voir les différences.Avis de la
vertical-align: middle;ne fonctionne pas commedisplay: table-cell;dansdisplay: inline-block;. Si vous avez de travail démo s'il vous plaît partager un.display:table-cellest prévu pour une utilisation à l'intérieur d'undisplay:table-row, lui-même à l'intérieur d'undisplay:table. Une utilisation incorrecte entraînera anonyme éléments en cours de création, qui peut interefere négativement avec d'autres aspects de votre mise en page.Cela étant dit,
vertical-aligna des significations très différentes dans les deux. Dansdisplay:inline-block, il se réfère à la façon dont l'élément lui-même s'aligne avec les éléments environnants. D'autre part, avecdisplay:table-cell, il aura une incidence sur l'alignement vertical des éléments à l'intérieur d'elle.