Les Positions CSS en 20 minutes - Absolute - Relative - Fixed - Sticky - Avec Exemples (2021) FR

Sdílet
Vložit
  • čas přidán 28. 08. 2024

Komentáře • 181

  • @nassimback
    @nassimback Před 3 lety +12

    si tu savait combien d'heures j'ai passé en essayant de comprendre ces positions sans résultat !!!! je ne pourrais jamais te remercier assez

    • @NadfriJS
      @NadfriJS  Před 3 lety +1

      Très heureux que cette vidéo fut bénéfique pour toi!

  • @alex-lbd
    @alex-lbd Před rokem +2

    WOW
    J'ai compris beaucoup de choses avec ton tuto, très simple esthétiquement ce qui fait qu'on ne se perd pas! Pis tes explications sont authentiques, claires, et maîtrisées!
    Merci beaucoup!

  • @morycamara6281
    @morycamara6281 Před 11 měsíci +1

    J'ai acheté beaucoup de formations mais, c'est ici que j'ai compris le positionnement en Css. Merci beaucoup!

    • @NadfriJS
      @NadfriJS  Před 11 měsíci

      Merci pour ce commentaire, il fait plaisir :)

  • @everydayquotes10
    @everydayquotes10 Před 3 měsíci

    Bonjour Monsieur, merci pour ce beau travail que vous aviez décidé de partagé gratuitement avec nous.
    Vous êtes vraiment un pédagogue, vous m'avez non pas simplement aidé à comprendre les produits position de CSS, mais m'aidé également à m'intéresser encore plus au développement Web

  • @user-xx1kq6ot7i
    @user-xx1kq6ot7i Před měsícem +1

    je découvre cette excellente vidéo merci

  • @arnaudjuet5508
    @arnaudjuet5508 Před 6 měsíci

    La meilleure explication trouvée sur le web concernant les positions en CSS ! Un grand merci et un grand bravo pour cet excellent tuto !

  • @marye1218
    @marye1218 Před rokem +1

    Merci mille fois pour votre tuto qui est juste génial pour la compréhension des différentes positions ! Bravo pour votre pédagogie !!!

  • @floriangasparine4436
    @floriangasparine4436 Před 2 lety +2

    J’ai juste envie de te dire un fucking MERCIIII !!! Une explication clair et précise sans fioriture et exemplifier ! Le rêve d’un débutant 😍 Tu as gagné un abonné un like et j’ai activé la cloche 💪🏾

    • @NadfriJS
      @NadfriJS  Před 2 lety

      Merci pour ton commentaire :)

  • @mrpolo8333
    @mrpolo8333 Před 4 měsíci

    Vous êtes le meilleur !!! J'ai passé un temps fou sur la propriété sticky sans comprendre pourquoi elle ne fonctionnait pas et vous m'avez parfaitement expliqué pourquoi 😁
    Merci infiniment !!!!!!!!!!

    • @NadfriJS
      @NadfriJS  Před 4 měsíci

      Merci de votre retour 😊

  • @soribakaba7366
    @soribakaba7366 Před rokem +4

    Une très bonne vidéo avec des explications compréhensibles

  • @vincentfaridmaalem2287
    @vincentfaridmaalem2287 Před 5 měsíci

    Il me faut des profs comme vous. Je comprends très bien maintenant. Merci beaucoup.

  • @tessayouaz5968
    @tessayouaz5968 Před 2 lety

    je n'arrive pas à croire que c'est aussi simple que ça, je galère avec les postions depuis un moment et cette vidéo est une révélation franchement Bravo!!! je m'abonne

  • @aissatoubobodiallo2449

    J’ai finalement compris les positions CSS. Et ce, grâce à vous Merci 🙏

  • @LesAmisDuCoran
    @LesAmisDuCoran Před rokem +1

    11:36 - donc vous comprenez sûrement rien du tout🤣🤣, j'ai aimé 🤣, merci pour l'explication, super claire 😇

  • @audreyvaccaro
    @audreyvaccaro Před rokem

    Un énorme merci!!!! Tellement plus simple à comprendre comme ça que dans la formation que je paye! Je m'abonne DIIIIIIIIIRECT 😀

  • @CaroFlo0410
    @CaroFlo0410 Před rokem

    Enfin des explications claires ! Je ne comprenais pas tout dans la documentation. Bravo et merci pour cette vidéo, je m'abonne à votre chaine, bonne continuation à vous :)

    • @NadfriJS
      @NadfriJS  Před rokem

      Merci pour ton commentaire :)

  • @hugor9660
    @hugor9660 Před 2 lety

    Enfin quelqu'un qui explique bien. Merci

    • @NadfriJS
      @NadfriJS  Před 2 lety

      Merci pour le compliment :)

  • @mustaphabousellam746
    @mustaphabousellam746 Před 3 lety

    Merci pour cet excellent tutoriel qui pour la première fois m'a permis de comprendre exactement ces différentes positions css

  • @shanwazghulam19
    @shanwazghulam19 Před 3 lety +1

    Excellente vidéo, c'est vraie que je ne voyais pas la différence entre relative et absolute mais maintenant c'est fait.

  • @isaack1579
    @isaack1579 Před rokem

    Salut et grand merci pour cette vidéo sa m'a vraiment. Bonne continuation, un abonné de plus

  • @user-td7jm6rs5n
    @user-td7jm6rs5n Před rokem

    Merci beaucoup pour ce tutoriel de qualité ! :)
    Vos explications sont super claires, et j'ai pris plaisir à réviser avec votre vidéo. Merci, merci ! :)

  • @malouette3991
    @malouette3991 Před 2 lety

    Excellent !! C'est la seule explication que j'ai vraiment comprise.

  • @youssoufmeite4693
    @youssoufmeite4693 Před 2 lety

    Wahou c'est aujourd'hui que j'ai vraiment compris merci

  • @PainNagato42
    @PainNagato42 Před 3 lety +2

    Je connaissais déjà les positions CSS mais merci pour cette révision ;)

  • @Boudha_Solo
    @Boudha_Solo Před 2 lety

    Salut, ta vidéo est très bien. Tu es très pédagogue et c'est ce qu'il faut pour un débutant comme moi et grâce toi je vais pouvoir rédiger du code plus propre et plus concis.

  • @raazyaa
    @raazyaa Před rokem

    Top vidéo pour comprendre les positions !!!

  • @francoismonfret8108
    @francoismonfret8108 Před 26 dny

    merci beaucoup monsieur

  • @daniellucarini870
    @daniellucarini870 Před 2 lety

    Enfin un tuto expliqué avec patience et clarté !!

  • @meyous-coder
    @meyous-coder Před rokem

    merci surtout pour la position relative du parent. c'était toujours flou

  • @mathus1906
    @mathus1906 Před 2 lety +1

    Merci pour cette vidéo, c'est pas totalement facile et ta vidéo est très utile pour comprendre :)

  • @cerisen
    @cerisen Před rokem

    Une vidéo super top bien expliqué j'ai enfin compris MERCI merciiiiii et bien sur je m' habonne

  • @Je.positive
    @Je.positive Před 2 lety +1

    Merci,Trop d'embrouilles!

  • @philstore788
    @philstore788 Před rokem

    Super vidéo ! J ai tout compris, c est bien détaillé et bien expliqué ! Merci pour le partage

  • @AlexandreCalmels
    @AlexandreCalmels Před rokem

    Merci pour ton travail !
    Tu m'as beaucoup aidé pour comprendre et bien utiliser les positions absolute et relative ;)

  • @jawadach
    @jawadach Před 3 lety +1

    Bravo, j'ai bien aimé les explications, sont très claires … un grand Merci

    • @NadfriJS
      @NadfriJS  Před 3 lety

      Merci à toi pour ton commentaire ;)

  • @misusvde7942
    @misusvde7942 Před rokem

    Whaou ! superbe tuto. Tellement bien expliqué et montré , merci bcp !

  • @saoryr2131
    @saoryr2131 Před rokem

    Merci beaucoup pour cette vidéo. Elle m'a bien aidé pour mon projet de creation de pop up 👍👍

  • @victorassiah4879
    @victorassiah4879 Před rokem

    Superbe tutoriel ; explication très claire et très concise. Merci beaucoup

  • @mourirderire1400
    @mourirderire1400 Před rokem

    Très bien expliqué !!!!

  • @imbackforevre4089
    @imbackforevre4089 Před 2 lety

    merci tres simple et tres efficace

  • @rachiid0074
    @rachiid0074 Před 2 lety

    Très bonne vidéo !!! Merciii 😜

  • @romainciszewicz7779
    @romainciszewicz7779 Před 2 lety

    Franchement félicitations pour tes explications , super professeur je like et je m'abonne.

  • @karimboussakri2186
    @karimboussakri2186 Před 11 měsíci

    super propre 💪

  • @smockydedaly
    @smockydedaly Před 2 lety

    C'est vraiment super et magnifique.
    Felicitation

  • @abderrahmaneaitallaoua6023

    très clair, merci.

  • @tribgraal
    @tribgraal Před rokem

    Merci pour ta vidéo !

  • @theryphil
    @theryphil Před 11 měsíci

    très bonne vidéo félicitation

  • @mohamedlegtibi802
    @mohamedlegtibi802 Před rokem

    Video bien expliquée. Grâce à toi j'ai bien compris les positions. +1 abonné

  • @asphaltking5870
    @asphaltking5870 Před rokem +1

    Très clair !!

  • @gonmk5361
    @gonmk5361 Před 2 lety

    Très bien expliqué !! Merci pour ton tuto de qualité.

  • @jocelynpater4754
    @jocelynpater4754 Před 2 lety

    Merci pour ce super top vidéo sur les positions. Bonne continuation et surtout la santé pour toujours.

    • @NadfriJS
      @NadfriJS  Před 2 lety

      Merci, la santé pour toujours je prends :)

  • @houssenranivoson2593
    @houssenranivoson2593 Před 2 lety

    Merci !

  • @lydia1136
    @lydia1136 Před rokem +1

    plus que magnifique vraiment merciiii beaucouppp de la part d une algeriennne merciiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii

    • @NadfriJS
      @NadfriJS  Před rokem +1

      Merci infiniment

    • @lydia1136
      @lydia1136 Před rokem

      @@NadfriJS c'est la moindre des choses

  • @plexussolair7716
    @plexussolair7716 Před rokem

    Merci.

  • @SofianeBTZ
    @SofianeBTZ Před rokem

    Merci infiniment !!

  • @saidhamani827
    @saidhamani827 Před 2 lety

    Perfect. Thanks

  • @noapage1768
    @noapage1768 Před 4 měsíci

    Merci

  • @naudz7
    @naudz7 Před rokem

    Merci pour ta vidéo ! Les explications sont top ✌

  • @bleuechabani1863
    @bleuechabani1863 Před 2 lety

    merci pour les vidéos

  • @ericerac4928
    @ericerac4928 Před rokem

    Super bien ton tuto et trés facile à comprendre. Petite correction qui n'a rien à voir avec les positions mais le lorem ipsum n'est pas un text aléatoire, il sagit d'un texte extrait en partit d'une oeuvre de Cicéron et surtout utilisé pour les d'essai d'imprimerie à partir du XVIe siècle. Voilà, et je me répète, ton tuto est bien fait.

    • @NadfriJS
      @NadfriJS  Před rokem

      Merci pour cette info que je ne connaissais pas ;)

  • @charleskouakou6908
    @charleskouakou6908 Před 2 lety

    merci beaucoup pour cette video

  • @adsiassicmsd
    @adsiassicmsd Před rokem

    merci !

  • @BenjaminAISHI-pf8rz
    @BenjaminAISHI-pf8rz Před rokem

    Merci beaucoup

  • @limaks8761
    @limaks8761 Před 2 lety

    SUPER

  • @mayerzrl
    @mayerzrl Před 2 lety

    Cette vidéo est top ! Merci à vous

    • @NadfriJS
      @NadfriJS  Před 2 lety

      Merci pour le commentaire :)

  • @romero1745
    @romero1745 Před rokem

    Génial pour tes explications.
    Merci pour tes contenus :)

  • @alfredkuate9370
    @alfredkuate9370 Před rokem

    Tres bien expliqué, vraiment je comprennais pas tres bien cette notion!!!
    Est ce que ta fais une video qui explique les flexbox????

    • @NadfriJS
      @NadfriJS  Před rokem

      Merci, j'ai pas fait de videos sur flex du fait qu'on en trouve pas mal sur youtube, mais si tu veux en savoir plus, regarde mes videos de tutos complets, faire une navbar responsive ou une todo list de A à Z, j'explique ces concepts

  • @bloullittaa
    @bloullittaa Před 2 lety

    Merci j'adore

    • @NadfriJS
      @NadfriJS  Před 2 lety +1

      Merci pour ton commentaire :)

    • @bloullittaa
      @bloullittaa Před 2 lety

      @@NadfriJS franchement trop bien expliqué, j'ai une évaluation en html css après demain grâce à ta vidéo je suis plus rassurée

  • @nicolassoulerot4169
    @nicolassoulerot4169 Před 2 lety

    Excellent, bonnes explications !!

  • @rachidbenanin4780
    @rachidbenanin4780 Před rokem

    C est super merci bcp

  • @cog969
    @cog969 Před 2 lety

    merci à vous ;)

  • @klemdev6640
    @klemdev6640 Před 2 lety

    super video !!! c'est très bien expliqué.

  • @gatessassistance3060
    @gatessassistance3060 Před 6 měsíci

    merci

  • @alhassanebah7607
    @alhassanebah7607 Před rokem

    merci beacoup

  • @MFRDeLaVega91
    @MFRDeLaVega91 Před 3 lety

    Bravo ! Super vidéo nécessaire

  • @sihemtoutsimplement6616

    Merci beaucoup , très utile !

  • @rcytv9613
    @rcytv9613 Před 2 lety +1

    Merci beaucoup pour les vidéos , c'est super !
    Aurais tu des conseils concernant le syndrome de la page blanche au niveau algo?
    Pouce bleu!

    • @NadfriJS
      @NadfriJS  Před 2 lety +2

      Merci, je donne quelques conseils sur l'algo dans mes vidéos correction de codinGame. Mais la règle c'est de prendre un crayon et un papier, et de noter étape par étape le raisonnement naturel du cerveau pour résoudre un problème. Une fois les étapes identifiées, tu les écris en code sans optimisation. A ce moment, tu vas remarquer que tu te répètes dans le code, et qu'une boucle serait plus judicieuse à tel endroit, puis quand ton code fonctionne, tu vas remarquer automatiquement que tu peux encore réduire la taille du code à tel ou tel endroit, puis à la fin ton code ne fera plus que quelques lignes.

    • @rcytv9613
      @rcytv9613 Před 2 lety

      @@NadfriJS Merci , je vais essayer d'appliquer tes conseils !

  • @Shakurjor
    @Shakurjor Před 3 měsíci

    Salut merci pour ces explications, j'aimerais une confirmation, le conteneur c'est bien une div dans ton cas?

  • @yathergame279
    @yathergame279 Před 3 lety +1

    On est d'accord que si on met notre nav bar avec comme propriété position:fixed; la nav bar va passer au-dessus du titre du site. Mais il n'y aurait pas moyen de contourner ce problème avec la propriété z-index comme vous l'avez expliquez ? Avec la propriété z-index, en mettant z-index:1; pour le titre et z-index:0; pour la nav bar, elle passera en dessous du texte nan ? Simple curiosité (sinon très bonne vidéo, en tant que débutant, votre vidéo ma très bien éclairci sur le sujet !)

    • @NadfriJS
      @NadfriJS  Před 3 lety

      Oui c'est possible, mais je ne pense pas que le résultat sera très esthétique ;)

    • @yathergame279
      @yathergame279 Před 3 lety

      @@NadfriJS D'accord, merci !

  • @gargouillestudiofx
    @gargouillestudiofx Před 2 lety

    salut, un grand, grand merci pour cette vidéo très bien faite, enfin je vais pouvoir avancer un peu sur les positions !!, juste une petite question...à quel moment serait il plus adéquat d'utiliser ' position: fixed ' ?. Encore merci !!!!

    • @NadfriJS
      @NadfriJS  Před 2 lety

      Salut, je dirais lorsqu'on a à fixer un élément à une autre position que Top, par exemple un menu en bas de l'écran, ou un icon de scroll sur le coté par exemple

  • @oredytech
    @oredytech Před 3 měsíci

    Je penses que sticky n'a pas fonctionner au début parce que son container à une position relative. Il faudrait donc enlever la position du container.

  • @djamal01010
    @djamal01010 Před 7 měsíci

    J'ai une question a propos du containers(parent) et de la positions absolue il faut qu'il soit absolument dans le containers(parent) si il est en dehors du containers dans ce cas la il prend toute la page c'est ça ???

    • @NadfriJS
      @NadfriJS  Před 7 měsíci

      Ca va remonter parent par parent jusqu'à en trouver un ayant une position relative, s'il ne trouve rien, alors le parent c'est body. L'element en absolute se positionne par rapport au 1er parent ayant une position relative, sinon c'est body par defaut.

  • @AsseveratecyprusMouyamba-hh3cx

    Bonjour ! J' aimerais savoir comment vous avez fait pour séparer les contraires de part et d' autres ?

    • @NadfriJS
      @NadfriJS  Před 6 měsíci

      J'ai pas bien compris la question 🤔

  • @nukken
    @nukken Před 2 lety

    Merci pour cette super vidéo je débute et tu m'as appris beaucoup de code, j'ai une question. Quand je mets dans mon un button, comment je change sa taille?

    • @NadfriJS
      @NadfriJS  Před 2 lety

      Salut, viens nous rejoindre sur mon discord, ca sera plus facile de repondre à tes questions, le lien est dans la description

  • @all-habibmohamed8058
    @all-habibmohamed8058 Před 2 lety

    Merci mais comment positionner le menu en haut a droite de mon site Web.

    • @NadfriJS
      @NadfriJS  Před 2 lety

      Regarde mon tuto sur faire un site responsive avec navBar

  • @charlesenglebert8226
    @charlesenglebert8226 Před 2 lety

    et ça fait quoi top, left par rapport à margin-top, margin-left ?

    • @NadfriJS
      @NadfriJS  Před rokem

      Avec les margins, tu vas pousser tous les elements qui sont autour, tandis que top,left,right,bottom te permettent de faire des superpositions.

  • @sadouadama9953
    @sadouadama9953 Před rokem

    merci pour la vidéo.en passant j'ai pas pigé une chose.le terme box dans css je ne le voix pas dans la page html.merci !

    • @NadfriJS
      @NadfriJS  Před rokem +1

      Salut, c'et juste une classe CSS, elle sert à styliser mes divs (ici un carré avec un contenu centré)

    • @sadouadama9953
      @sadouadama9953 Před rokem

      J'ai pas compris ton explication mais c'est bon a travers des test j'ai compris

  • @mimounkada5271
    @mimounkada5271 Před 3 lety

    👍🏻👍🏻👍🏻

  • @a9darrouh132
    @a9darrouh132 Před 3 lety

    Merci beaucoup. j'espère que vous allez faire de transformer un site static vers dynamic avec php et bonne continuation ❤️❤️❤️

    • @NadfriJS
      @NadfriJS  Před 3 lety

      Je ne fais pas du PHP, je suis plutot sur React en ce moment, mais voici une super chaine pour le PHP, les teachers du web
      czcams.com/channels/zuaB4F2znrMggxcwUuVhAw.html

    • @a9darrouh132
      @a9darrouh132 Před 3 lety

      @@NadfriJS je trouve seulement que des cours du java et autres cours 😔

    • @NadfriJS
      @NadfriJS  Před 3 lety

      @@a9darrouh132 PHP ca s'utilise avec des framework, il y en 2 connus, laravel et Symphony. La tu verras plein de cours dessus.

    • @a9darrouh132
      @a9darrouh132 Před 3 lety

      @@NadfriJS Je veux convertir un site statique en site dynamique permettant aux visiteurs de laisser leurs commentaires et de me contacter via leurs commentaires mais je ne sais pas quel est le langage que je dois l'utiliser ?

    • @NadfriJS
      @NadfriJS  Před 3 lety +1

      @@a9darrouh132 Je pense que le plus simple est avec PHP et une base de donnée MYSQL. Essaie ce cours :
      czcams.com/video/X2Apw1CDDJQ/video.html

  • @dukenuggets
    @dukenuggets Před rokem

    le sticky c'est débordant ce que tu ne dis pas, si tu met par exemple un translate pour cacher un élément tu verra le scroll horizontal et ça et c'est moche donc fixed quitte a mettre un margin sur le container c'est mieux.

  • @sadouadama9953
    @sadouadama9953 Před rokem

    et aussi quel est l'importance de la position static

    • @NadfriJS
      @NadfriJS  Před rokem +1

      C'est la valeur par defaut quand tu mets rien. Pas vraiment d'interet en soit, sauf dans de rare cas pour des animations CSS ou tu passes d'une position fixed à static par exemple.

    • @sadouadama9953
      @sadouadama9953 Před rokem

      @@NadfriJS merci beaucoup.si tu avait un blog je serais le premier.j'aime les réponses claires et instantané

  • @tilksamousse
    @tilksamousse Před rokem

    🤓