CSS: position absolu ou display grid ?
charline159
Messages postés
208
Date d'inscription
Statut
Membre
Dernière intervention
-
charline159 Messages postés 208 Date d'inscription Statut Membre Dernière intervention -
charline159 Messages postés 208 Date d'inscription Statut Membre Dernière intervention -
Bonjour, j'ai vu qu'il était possible de positionner des éléments sur une page web de plusieurs manières, entre autre en utilisant un
ou bien un
Si je souhaite disposer mes éléments d'une certaine manière sur ma page, par exemple de cette manière:
Y a t-il une méthode à préférer entre la position absolue et un display grid ?
position: absolute;
ou bien un
display: grid;
Si je souhaite disposer mes éléments d'une certaine manière sur ma page, par exemple de cette manière:
Y a t-il une méthode à préférer entre la position absolue et un display grid ?
A voir également:
- CSS: position absolu ou display grid ?
- Css download - Télécharger - HTML
- Enlever le soulignement d'un lien css ✓ - Forum Réseaux sociaux
- Css ligne horizontale ✓ - Forum CSS
- Enlever le soulignage des lien. - Forum CSS
- Enlever soulignement lien css ✓ - Forum CSS
5 réponses
Salut,
non.
Ce sont 2 propriétés différentes, elles ne s'excluent pas d'ailleurs.
ça dépends donc du contexte(les éléments à positionner, la mise en page voulue) et de vos habitudes de mise en page.
"de positionner des éléments sur une page web de plusieurs manières"
Certes, c'est un langage. Il existe bien des manières de positionner des éléments.*
Les propriétés que vous évoquez ne suffise pas pour cela d'ailleurs.
Avec position absolue le placement se fait à partir des positions des côtés de la page, avec display grid le placement se fait en 'grille".
Le placement avec la position absolute à pour avantage de ne pas tenir compte du flux du document(ordre des éléments par rapport aux uns aux autres) et comme inconvénient de ne pas tenir compte du flux du document.
en display:grid;
grid Displays an element as a block-level grid container
https://www.w3schools.com/CSSref/pr_class_display.asp
Positionner en "grille" me semble assez complexe dans la plupart des cas.
C'est un choix, tout dépends des éléments à positionner.
Quant à la propriétés position en CSS elle a bien d'autres valeurs possibles(display aussi) qui permettent le positionnement.
Côté positionnement il y a beaucoup de propriétés CSS qui peuvent servir, tout un tas de méthodes(faites quelques recherches positionnement CSS).
Par exemple du côté des marges et des propriétés de display(inline par exemple) ou même en utilisant float, ce sont aussi d'autres possibilités de positionnement qui peuvent être pratique(aboutir à un résultat le plus simplement et avec le moins à écrire possible).
"Si je souhaite disposer mes éléments d'une certaine manière sur ma page, par exemple de cette manière:"
Oui donc avant tout séparer l'affichage du contenu. écrivez le HTML. Apprenez CSS éventuellement.
Il n'y a pas de méthode magique mais c'est un langage(descriptif) CSS, il permet de manipuler les éléments HTML, de faire leur mise en page.
Et pour ça il faut écrire CSS, tout d'abord restez dans le flux du document pour faire une mise en page histoire d'apprendre les bonnes façons avant d'aller vers des exceptions(possibles mais pas la règle).
non.
Ce sont 2 propriétés différentes, elles ne s'excluent pas d'ailleurs.
ça dépends donc du contexte(les éléments à positionner, la mise en page voulue) et de vos habitudes de mise en page.
"de positionner des éléments sur une page web de plusieurs manières"
Certes, c'est un langage. Il existe bien des manières de positionner des éléments.*
Les propriétés que vous évoquez ne suffise pas pour cela d'ailleurs.
Avec position absolue le placement se fait à partir des positions des côtés de la page, avec display grid le placement se fait en 'grille".
Le placement avec la position absolute à pour avantage de ne pas tenir compte du flux du document(ordre des éléments par rapport aux uns aux autres) et comme inconvénient de ne pas tenir compte du flux du document.
en display:grid;
grid Displays an element as a block-level grid container
https://www.w3schools.com/CSSref/pr_class_display.asp
Positionner en "grille" me semble assez complexe dans la plupart des cas.
C'est un choix, tout dépends des éléments à positionner.
Quant à la propriétés position en CSS elle a bien d'autres valeurs possibles(display aussi) qui permettent le positionnement.
Côté positionnement il y a beaucoup de propriétés CSS qui peuvent servir, tout un tas de méthodes(faites quelques recherches positionnement CSS).
Par exemple du côté des marges et des propriétés de display(inline par exemple) ou même en utilisant float, ce sont aussi d'autres possibilités de positionnement qui peuvent être pratique(aboutir à un résultat le plus simplement et avec le moins à écrire possible).
"Si je souhaite disposer mes éléments d'une certaine manière sur ma page, par exemple de cette manière:"
Oui donc avant tout séparer l'affichage du contenu. écrivez le HTML. Apprenez CSS éventuellement.
Il n'y a pas de méthode magique mais c'est un langage(descriptif) CSS, il permet de manipuler les éléments HTML, de faire leur mise en page.
Et pour ça il faut écrire CSS, tout d'abord restez dans le flux du document pour faire une mise en page histoire d'apprendre les bonnes façons avant d'aller vers des exceptions(possibles mais pas la règle).
Je vois, merci pour cette réponse détaillée. J'essayerai d'utiliser un maximum ces deux outils afin de les distinguer au mieux, pour pouvoir les choisir dans la situation qui s'y prête le mieux.
Salut,
Je mets un coup de pied dans la fourmilière. Pourquoi pas flex ? Il est bien intégré à CSS comme grid et il est très puissant.
Un lien de la bible du CSS : https://css-tricks.com/snippets/css/a-guide-to-flexbox/
Un lien francophone d'un bon site de création Web : https://www.alsacreations.com/tuto/lire/1493-css3-flexbox-layout-module.html
Je mets un coup de pied dans la fourmilière. Pourquoi pas flex ? Il est bien intégré à CSS comme grid et il est très puissant.
Un lien de la bible du CSS : https://css-tricks.com/snippets/css/a-guide-to-flexbox/
Un lien francophone d'un bon site de création Web : https://www.alsacreations.com/tuto/lire/1493-css3-flexbox-layout-module.html
Justement, ma question consistait à savoir ce qu'il était le plus approprié d'utiliser, et dans quelles circonstances.
Merci pour les liens!
Merci pour les liens!
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question