[RÉGLÉ] Bootstrap carousel et MenuBox cote à cote

[lionhigh]

Bonjour,

J'essaye de positioner deux div cote a cote dans mon header. Le premier contient le bootstrap carousel et le deuxième est une boite menu.

Une contrainte est que le div du carousel doit être en position relative, sinon il n'est pas zoomé sur les mobiles.

L'adresse du site en question est : http://www.lthah.lu/v3

Merci pour votre aide, et si vous avez besoin de plus d'infos, n'hésitez pas...

Ti

PS: Ca fait 36 heures que je permute les float et les position :-/

[lefabdu51]

Re : Bootstrap carousel et MenuBox cote à cote

je vois qu il y as bootstrap d installé....
tu as une classse row.

Essaye d ajouter la classe span8 sur ta premiere div et la classe span4 sur la seconde. le total fait 12 et c est bootstrap qui s occupes du reste.

[lionhigh]

Re : Bootstrap carousel et MenuBox cote à cote

Merci, la classe row était un test, repris de l'endroit où j'ai trouvé un module bootstrap carousel (http://lab.zenjiapps.com/zabt-carousel-xt/examples-xt). Je l'ai remise d'origine vers la classe container-fluid.

Ensuite j'ai modifié le header du template :
Original:

<div class="container-fluid">
<jdoc:include type="modules" name="header" style="none" />
</div>

Final pour mes besoins de layout j'ai pris span9 et span3 :

<div class="container-fluid">
<div class="span9">
<jdoc:include type="modules" name="header" style="none" />
</div>
<div class="span3">
<jdoc:include type="modules" name="header-menu" style="none" />
</div>
</div>

Puis j'ai attribué la position header-menu à la MenuBox.

Merci pour l'aide lefabdu51 !

Il me reste un problème de layout : le carousel ne prends pas la même largeur que les 3 menus box en dessous. Une idée ?

[lionhigh]

Re : Bootstrap carousel et MenuBox cote à cote

Il me reste un problème de layout : le carousel ne prends pas la même largeur que les 3 menus box en dessous. Une idée ?

Dans le css bootstrap-responsive j'ai trouvé d'autres paramètres de span9. Pour l'instant j'ai modifié la valeur de span9 870px vers 888px, qui donne le meilleur rendu.

.container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { width:1170px; }
.span12 { width:1170px; }
.span11 { width:1070px; }
.span10 { width:970px; }
.span9 { width:888px; }

Si quelqu'un peut proposer une meilleure solution, je suis biensûr prenant !

Merci encore au fabdu51

[lefabdu51]

Re : Bootstrap carousel et MenuBox cote à cote

publies tes deux modules dans la meme position......cela marcheras mieux. et met les spans comme suffixes de classe de module.

[lionhigh]

Re : Bootstrap carousel et MenuBox cote à cote

publies tes deux modules dans la meme position......cela marcheras mieux. et met les spans comme suffixes de classe de module.

Merci ! Il suffisait de trouver les bons champs pour la configuration :
ajouter span9 et span3 aux champs "Module Class Suffix" du template !