Quand j'intègre bootstrap dans mon site, y'a des display block sur les ul qui disparaissent , ducoup ça me détruit mon menu.
Moi je souhaite juste intégrer des petits composants comme des boutons sans rien changer à côté , comment je fais svp ?
Poste ton code, comment tu intègres Bootstrap ?
D'une manière générale il faut que tu intègres la librairie avant ton propre code de manière à ce que le navigateur puisse écraser le CSS après coup avec ton propre style.
Après avoir fait ça, en pratique si Bootstrap a comme style par défaut ceci :
button {
border-radius: 0.25rem;
}
Ton code placé après la librairie écrasera ce style par le principe de Cascade.
button {
border-radius: 0.5rem;
}
https://developer.mozilla.org/fr/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance#la_cascade
( ça équivaut pour n'importe quel type de CSS cela dit, même ton propre code )
Enfaite j'ai testé en intégrant bootstrap en premier et j'ai toujours le même problème.
Mon css est pas écrasé c'est juste que j'ai l'impression que bootstrap met des marges où je sais pas trop mais je vois qu'il modifie mon code alors que je l'ai pas appeller
Fait CTRL + F5 pour nettoyer ton cache au cas où car desfois le navigateur il sauvegarde des modifs indésirables
Le 10 août 2021 à 22:22:37 :
Fait CTRL + F5 pour nettoyer ton cache au cas où car desfois le navigateur il sauvegarde des modifs indésirables
J'ai testé mais c'est pas ça le problème. J'ai l'impression Bootstrap modifie des balises html classique et j'aimerais savoir lesquelles et comment éviter ce genre de modification.
Poste ton code. De mémoire Bootstrap ne permet pas d'importer des composants ou de proposer une version lite, ça a du changer ça fait des plombes que je ne l'ai pas utilisé, mais auquel cas ils l'auraient annoncé sur leur page.
Je pourrais pas plus t'aider que ça si tu ne me m'indiques pas ton code, ton devtools, un exemple de CSS qui est intégré par Bootstrap dont tu n'arrives pas à modifier.
La plus simple des manières et de faire un hard-reset des règles que tu ne veux pas utiliser, toujours avec le principe de cascade.
Dans tes devtools tu peut voir quelle propriété écrase les autres normalement, et avec !important tu passes au dessus des propriétés bootstrap
ul{
display : block!important;
}
Tu peut aussi voir d'où viennent les propriétés qui influent sur une div depuis les devtools
Si tu souhaite importer des modules séparés de Bootstrap, la seule solution c'est de le télécharger et de faire le tri des fichiers dont tu as besoin, comme dit plus haut Bootstrap ne permets pas d'importer des composants CSS un par un, quand tu importes la lib, t'as tout le css.
Si tu veux uniquement le styles des boutons va sur cette url : https://getbootstrap.com/docs/3.4/customize/
Tu peux customiser ton bootstrap pour n'avoir que ce que tu veux
ScientistLambda C'est une très mauvaise pratique d'utiliser et d'abuser ( car il va en falloir ) !important en CSS.
Le "mieux" sans se prendre plus que ça la tête c'est qu'il utilise le principe de cascade du langage, le lien que rocher-volant à envoyé concerne les anciennes versions de Bootstrap :
https://getbootstrap.com/docs/5.1/getting-started/contents/
Non c'est déconseillé d'écraser les styles, tu devrais adapter la librairie à ce que tu veux ou créer tes propres thèmes, et si tu veux un design plus personnel vas plutôt sur TailwindCSS du BEM SASS
Tu lui conseilles d'apprendre 2 technos différentes alors qu'il pourrait embrasser le principe de base de CSS ..
J'ai bien dit que c'était le plus simple, libre à chacun de faire sa sauce après, par déconseillé je sais pas trop ce que tu veux dire.