1476 sujets

Web Mobile et responsive web design

Bonsoir,

Me revoilà ! Smiley lol

J'ai un autre soucis avec BOOTSTRAP...

J'arrive pas à aligner le bloc "blog news" et le bloc au dessus "out of stock"

Le lien ici : vaurel.free.fr/shoes/index2.html

Pfffuu c'est la galère!

Avez-vous une idée?

Merci Smiley smile

En attendant, je continue mes "tests" pour trouver la solution....
Modifié par oceane751 (13 Apr 2015 - 22:46)
hello!

Oui ça va m'aider, merci Smiley cligne

Mais juste une petite question..
Peut on mettre une class "container" dans une class "container-fluid" ?

Merci encore!
Modérateur
Même si je ne vois pas trop l'utilité, je ne vois pas trop de soucis...
Attention simplement aux doubles padding possibles.
Généralement tu fais un choix en début (ou pas) de projet pour savoir si tu veux des paliers (.container) ou un contenu fluide (.container-fluid).

Souviens toi toujours que Bootstrap & co, ce ne sont que des .class prédéfinies pour 1 ou plusieurs propriétés.
Quand tu regardes dans le code, tu vois que .container-fluid fait seulement ceci :

.container-fluid{
     margin-right: auto;
     margin-left: auto;
     padding-left: 15px;
     padding-right: 15px;
}


N'hésite pas aussi à regarder la doc.

Yordi
Modérateur
Tu devrais :

- supprimer la class .carousel-indicators, ça permettra des les centrer directement sans chichis...
- ne surtout pas changer le padding de .container comme tu l'as fait :

@media (min-width: 1200px)
    .container {
        padding-left: 145px;
    }


- toujours faire en sorte que tes .col-* fassent au total : 12. La grille de bootstrap est basée sur 12 colonnes donc pour la grille de tes chaussures, si tu en mets 3 de large, tu dois mettre un col-lg-4 et pas col-lg-3.

- ne met pas un .row en enfant direct d'un autre .row (sinon les padding vont se cumuler). Dans un .row, il ne faut y mettre en enfants direct que des .col-*
Yordi a écrit :

- ne surtout pas changer le padding de .container comme tu l'as fait :

@media (min-width: 1200px)
    .container {
        padding-left: 145px;
    }



Oui ok mais je fais comment pour bien centrer mon site?
avec "container" seul, ça ne centre pas comme je le voudrai, bien au milieu
Mais après, je joue avec les @media Smiley ohwell

Ou sinon, pour chaque blocs, je mets un padding-left pour centrer au lieu de le mettre directement dans . container ? Smiley ohwell
Modifié par oceane751 (20 Apr 2015 - 07:49)
Modérateur
Justement le point suivant dit :
Yordi a écrit :
Tu devrais :
- toujours faire en sorte que tes .col-* fassent au total : 12. La grille de bootstrap est basée sur 12 colonnes donc pour la grille de tes chaussures, si tu en mets 3 de large, tu dois mettre un col-lg-4 et pas col-lg-3.


Désolé si ce n'était pas clair...
Regarde l'exemple sur la doc de bootstrap qui est assez parlant. Si sur ta grille de 12 colonnes, tu n'as que 9 colonnes, tu auras un espace à droite car elles démarrent toujours de la gauche. Donc si tu as bien un total de 12 colonnes à chaque row, tout se passera bien Smiley smile
et pis, si j'ai des margins entre chaque divs (comme pour les chaussures), la totalité ne fera pas 12 Smiley ohwell

j'ai commencé à mettre le col-lg-offset-1, et ça prend forme..

sauf pour le hr.. impossible de le mettre en place

merci encore de ton aide Smiley smile
Modifié par oceane751 (20 Apr 2015 - 20:38)