Boucling

Je comprends RIEN aux BOX/POSITION CSS

28 messages

Mise à jour: il y a 10 mois

1
OP
LN

LainNonBinaire

il y a 10 mois

C'est infâme à comprendre

Comment avez vous fait pour maîtriser le truc ?

SR

SRXT

il y a 10 mois

J'utilise pas ça généralement. Je fais tout à coup de display: flex
Si y'a besoin d'un positionnement particulier généralement c'est un position: absolute et ensuite je mets ça relatif à la page (le footer bottom 0 le header top 0 etc.)

MR

MasterReiss

il y a 10 mois

On est en 2010 ou ?

OP
LN

LainNonBinaire

il y a 10 mois

Bon donc les items sont contenues dans un contenaire

Justify-content flex-start/flex-end/center/space-between/ permet de positionner l'item

Ça ok

OP
LN

LainNonBinaire

il y a 10 mois


On est en 2010 ou ?

Comment ça

J'apprends à coder en 2k24
Faut bien passer par le CSS non ?

OP
LN

LainNonBinaire

il y a 10 mois


J'utilise pas ça généralement. Je fais tout à coup de display: flex
Si y'a besoin d'un positionnement particulier généralement c'est un position: absolute et ensuite je mets ça relatif à la page (le footer bottom 0 le header top 0 etc.)

bordel j'ai rien compris kheyou

au display

LT
EB

EncoreBanPourR1

il y a 10 mois

pourtant c'est pas bien compliquer. j'ai tout appris sur le tas avec l'inspecteur d'élément.

il est ou ton probleme ?
pour moi la méthode la plus simple c'est d'imaginer un tableau excel dont tu veux custom les cases.

SR

SRXT

il y a 10 mois

bordel j'ai rien compris kheyou

au display

Bah display: flex ça permet de rendre le conteneur en display de type flex.
Ensuite tu dis une direction: "flex-direction: column" donc tous les trucs dedans vont s'afficher en colonne. Ensuite tu peux customiser le truc pour centrer (justify-content: center...), ou mettre un gap (avec "gap" par exemple). Tu peux grow un élément en priorité par rapport aux autres avec flex-grow...

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

OP
LN

LainNonBinaire

il y a 10 mois

Ça m'aide pas d'avantage

C'est juste les concepts que je percute pas pour le moment

Comment je fais si je veux créer un containaire dans un containaire ?

NU

NayeonUnnie

il y a 10 mois

Personne ne comprend rien, met du flex partout et joue avec la console google chrome jusqu'à ce que ça passe https://image.noelshack.com/fichiers/2022/07/3/1645038136-tzuyuprincesse.png

OP
LN

LainNonBinaire

il y a 10 mois


Personne ne comprend rien, met du flex partout et joue avec la console google chrome jusqu'à ce que ça passe https://image.noelshack.com/fichiers/2022/07/3/1645038136-tzuyuprincesse.png

C'est quoi le flex

Rien que ça je comprends pas bordel

NU

NayeonUnnie

il y a 10 mois

LainNonBinaire

il y a 10 mois

C'est quoi le flex

Rien que ça je comprends pas bordel

Bah c'est juste une manière d'agencer tes div. Tu peux agencer en block, en flex, en inline, etc.

OP
LN

LainNonBinaire

il y a 10 mois

Ok je comprends un peu mieux le concept de flux, ça me bloquait pas mal ma compréhension

bon j'ai vu

Float = pour faire flotter autour d'un élément

Display: flow-root ça fait éviter que l'élément se barre du container

Position absolue : permet de faire "sortir du flux"
Relative : dans le flux

sticky : bloque l'élément dans le flux
fixed : pareil mais n'est pas dans le flux

OP
LN

LainNonBinaire

il y a 10 mois

https://www.noelshack.com/2024-29-5-1721341433-barrehaut.png

comment je règle ça les kheys
bon ça se voit pas sur le screen

je veux mettre une sidebar

mais ça me met un petit en tête et bas de page blanc en ligne.
j'aimerais avoir le fond d'écran qui prenne 100% de toute la page, du containeur principal (body ?)

OP
LN

LainNonBinaire

il y a 10 mois

ok j'ai réglé le soucis en faisant

  • {margin: 0px; }
L-

lit-a-baldaquin

il y a 10 mois

utilise ce site si jamais tu veux voir en direct un bout de ton code, ca te permet de gagner du temps si tu veux faire des test pour positionner tes item
https://codepen.io/timsamoff/pen/QQrPPy

AP

AntiPNJ_

il y a 10 mois

Html css gpt genere absolument tout sans erreur car ce nest pas de la prog et quand ya pas de raisonnement logique il ne se trompe pas.

UT

Utalkintome

il y a 10 mois

J'utilise les grid parce que les flex c'est trop chiant https://image.noelshack.com/fichiers/2022/05/1/1643663361-full-new.png

L-

lit-a-baldaquin

il y a 10 mois


J'utilise les grid parce que les flex c'est trop chiant https://image.noelshack.com/fichiers/2022/05/1/1643663361-full-new.png

this ! c'est vrai que c'est bien plus simple de faire comme ca mais bon, meme sur ta grid t'es obliger de placer tes éléments selon l'agencement que tu veux

AD

AnusDePierre

il y a 10 mois

Fait le en rack 32 bordel

B0

Bettlejuice01

il y a 10 mois

Comment ça

J'apprends à coder en 2k24
Faut bien passer par le CSS non si on veut pas se limiter à WordPress ?

Euh pourquoi tu fais pas du node code ? Framer webflow wix...

UT

Utalkintome

il y a 10 mois

this ! c'est vrai que c'est bien plus simple de faire comme ca mais bon, meme sur ta grid t'es obliger de placer tes éléments selon l'agencement que tu veux

Mais c'est super facile, le seul truc c'est que ça s'adapte pas à la taille de la fenêtre mais je m'en fout je suis pas pro. Après y a des bons tuto français sur youtube qui m'avaient permis de comprendre les flexbox l'op.

OP
LN

LainNonBinaire

il y a 10 mois


Fait le en rack 32 bordel

C'est quoi ?

OP
LN

LainNonBinaire

il y a 10 mois

Euh pourquoi tu fais pas du node code ? Framer webflow wix...

Parce que je veux avoir la liberté de pouvoir tout faire
+ pas envie de payer

[S

[Skream]

il y a 10 mois

utilise chatgpt pour qu'il t'explique les bases

et tu lui poses une question à chaque fois que tu comprends pas un truc

y a rien de compliqué en vrai, perso je connais pas le css3, que le css2.1, mais la version 3 me semble plus simple à apprendre donc t'y arriveras t'inquiète pas

OP
LN

LainNonBinaire

il y a 10 mois


utilise chatgpt pour qu'il t'explique les bases

et tu lui poses une question à chaque fois que tu comprends pas un truc

y a rien de compliqué en vrai, perso je connais pas le css3, que le css2.1, mais la version 3 me semble plus simple à apprendre donc t'y arriveras t'inquiète pas

j'ai déjà assez du mal comme ça

chat gpt va rien capter à mes explications de noob ayaoi

OP
LN

LainNonBinaire

il y a 10 mois

bon ça va je suis content j'ai un peu progressé depuis la dernière fois