twitter bootstrap carrousel taille
Je crée un site web pour mon père en utilisant Twitter Bootstrap, c'est fait sauf pour une chose: Je ne peux pas comprendre comment:
- réduire la largeur du Carrousel
- centrer le carrousel
- faire défiler les flèches toujours sur l'image
Voici le site web afin que vous puissiez vérifier la source
Je suis littéralement allé ligne par ligne à travers le css et ajusté tous les aspects du Carrousel, puis vérifié dans mon navigateur.
Un autre point de confusion est que certains de ces les ajustements ont un effet si je le teste dans mon navigateur avec MAJ + CTRL + R (donc notepad++ l'ouvre dans google chrome directement depuis mon bureau sans utiliser un serveur ou un hôte) et ont vu des changements gênants, mais aucun de ces changements ne se répercute lorsque je les place sur le serveur.
J'ai vu d'autres messages suggérant des ajustements à .carousel
et @image
et j'ai essayé ceux-ci sans succès.
2 réponses
Vous pouvez simplement définir la largeur du carrousel en utilisant CSS. Le centrage d'un élément de bloc se fait avec margin: 0 auto
. Ne changez que le CSS de .carousel
, le reste est automatiquement stylé correctement.
<div id="myCarousel" class="carousel slide" style="width: 400px; margin: 0 auto">
...
</div>
Consultez ce jsfiddle pour le voir fonctionner.
Ajoutez simplement une classe de 'container' sur le DIV avec un ID de 'myCarousel'.
Donc ça...
<div id="myCarousel" class="carousel slide">
Devient...
<div id="myCarousel" class="carousel slide container">