Tout élément positionné est considéré de type bloc? Késako ?

Bonjour,

Actuellement en train de lire le superbe ouvrage "CSS 2 : Pratique du design web", je suis tombé sur ces deux paragraphes que je ne comprends pas :

Raphaël Goetter a écrit :

Page 115
Tout élément positionné en absolu est considéré de type bloc. Les éléments en ligne peuvent ainsi recevoir des dimensions et des bordures.

Raphaël Goetter a écrit :

Page 122
A nouveau, tout élément positionné en flottant est considéré de type bloc. Les éléments en ligne peuvent ainsi recevoir des dimensions et des bordures.

Ce n'est pas la position d'un élément qui définit son type (bloc, inline), mais bien l'élement lui même (p, span...) qui définit son type (bloc, inline), n'est ce pas ? Du coup, je ne comprend pas cette remarque...

Une âme charitable pourrait-elle m'expliquer ce que l'auteur a voulu dire par là ?

Merci d'avance
Modifié par Aixki (29 Aug 2012 - 17:23)

En gros, position:absolute et float : left/right effectue une sorte de display : block sur l'élément.

D'accord. Puisque je n'en suis pas encore arrivé au chapitre qui traite de la propriété display, j'avais un peu du mal à comprendre la présence de cette remarque.

Toutefois, je ne comprend toujours pas pourquoi l'auteur écrit :

Raphaël Goetter a écrit :

Les éléments en ligne peuvent ainsi recevoir des dimensions et des bordures.

En effet, à lire le paragraphe en entier, on déduit que c'est la position d'un bloc qui entraîne la possibilité de définir dimension et bordure sur un élément inline.
Qu'est ce que l'auteur veut dire par là ? On peut pas définir de dimensions/bordures sur un élément inline s'il n'y a pas de blocs positionnés autour ?
Modifié par Aixki (29 Aug 2012 - 17:30)

Bonjour,

on ne peut pas définir de dimensions à élément inline du tout : imagine un texte en gras au milieu d'un paragraphe, il serait idiot d'ajouter des marges autour en déformant les lignes environnantes et le paragraphe.

Seules les éléments de types blocs le peuvent ( en schématisant, car il faut également ajouter les cellules de tableau, les champs de saisies etc.. ) ; par contre un élément inline auquel on ajoute un float deviendra un élément de type bloc, et pourra donc se voir définir des dimensions.

Le concept de flux est assez compliqué à appréhender au début, mais relativement simple au final.

Bon courage !

Ahhhhhh j'ai enfin compris le sens du paragraphe !

C'est lorsqu'on positionne un element inline en absolute/fixed/float que l'on peut lui définir des dimensions car il devient un élément de type bloc !

Merci beaucoup

Aixki a écrit :

C'est lorsqu'on positionne un element inline en absolute/fixed/float que l'on peut lui définir des dimensions car il devient un élément de type bloc !

Non tu n'as pas compris, le fait de pouvoir le dimensionner si on le positionne n'est qu'une conséquence. Si la seule chose que tu souhaites faire est lui donner des dimensions il suffit de lui appliquer un display: block ou display: inline-block.

jb_gfx a écrit :


Non tu n'as pas compris, le fait de pouvoir le dimensionner si on le positionne n'est qu'une conséquence. Si la seule chose que tu souhaites faire est lui donner des dimensions il suffit de lui appliquer un display: block ou display: inline-block.

Sisi, j'avais bien compris qu'il s'agissait d'une conséquence et non d'un moyen. Mais merci tout de même de préciser pour lever toute ambiguité

Aixki a écrit :

Sisi, j'avais bien compris qu'il s'agissait d'une conséquence et non d'un moyen. Mais merci tout de même de préciser pour lever toute ambiguité

Ok

Aixki a écrit :
Une âme charitable pourrait-elle m'expliquer ce que l'auteur a voulu dire par là ?

Bonjour,

Je connais un peu l'auteur et je peux te répondre sur ce point

En fait, il s'agit d'une grosse bêtise : position absolute et float ne transforment pas du tout un élément en block. Par contre il lui permettent d'avoir des dimensions.

Pour en savoir plus : http://blog.goetter.fr/post/21980471007/le-saviez-vous-display-est-inutile-sur-un-element

Désolé pour cette erreur dans ce livre. A ma décharge, il date originellement de 2005 et sa dernière édition date d'il y a quelques années.

Ten a écrit :

on ne peut pas définir de dimensions à élément inline du tout

En fait si : si l'élément inline est retiré du flux (position absolute ou float), il pourra tout à fait bénéficier de dimensions.

Ten a écrit :
par contre un élément inline auquel on ajoute un float deviendra un élément de type bloc, et pourra donc se voir définir des dimensions.

En fait non.
C'est un peu plus compliqué que ça : la propriété float écrase automatiquement la propriété display (que ce soit block ou inline). Cette dernière n'est tout simplement plus interprétée (voir mon lien précédent).
En float, l'élément acquiert des propriétés spéciales comme tout élément hors du flux.
Modifié par Raphael (29 Aug 2012 - 18:22)

Raphael a écrit :

Bonjour,

Je connais un peu l'auteur et je peux te répondre sur ce point

En fait, il s'agit d'une grosse bêtise : position absolute et float ne transforment pas du tout un élément en block. Par contre il lui permettent d'avoir des dimensions.

Pour en savoir plus : http://blog.goetter.fr/post/21980471007/le-saviez-vous-display-est-inutile-sur-un-element

Désolé pour cette erreur dans ce livre. A ma décharge, il date originellement de 2005 et sa dernière édition date d'il y a quelques années.

Merci Raphaël pour ta réponse (le forum semble sympathique, je me permet le "tu" ).

Je vais lire ton article afin d'avoir l'esprit clair et bien informé sur le sujet. Pas de problème pour l'erreur, et encore félicitation pour ton ouvrage agréable à lire !

Aixki a écrit :

(le forum semble sympathique, je me permet le "tu" ).

Avec plaisir

Aixki a écrit :
et encore félicitation pour ton ouvrage agréable à lire !

En toute sincérité, je le trouve moi-même un peu obsolète dans certains domaines.
Si tu aimes lire, je peux te proposer une liste d'ouvrages plus récents : http://blog.goetter.fr/post/30459978737/les-bons-livres-html-css