[PBTV4.1] 2 Flux cote à cote en externe

[PBTV4.1] 2 Flux cote à cote en externe [Réglé]

Créations de Thèmes

MickaelFR Membre non connecté

Booster Fusée

Le 22/01/2017 à 18h08

#156691

Booster Fusée
Voir le profil du membre MickaelFR
Inscrit le : 20/01/2014
Site internet
Groupes :

Reprise du message précédent

Bonjour.

Vu que c'est valable pour la V5, je me permet de déterrer le sujet ..

Il faut modifier quels fichiers svp? Sur mon site : <a href="http://planet-truck.fr/site/">http://planet-truck.fr/site/</a> je souhaite mettre deux flux côte à côté, comme les modules en dessous (en accueil) .. Mais je n'y arrive pas, sans que tout soit bien alignés ..

Merci <img src="/images/smileys/smile.png" alt=":)" class="smiley" />

planet-truck.fr - mickaelfr.eu

babsolune Membre non connecté

Equipe Développement Administrateur

Le 22/01/2017 à 19h51

#156692

Administrateur
Voir le profil du membre babsolune
Inscrit le : 16/05/2008
Site internet
Groupes :
Equipe Développement

plop

<a href="http://prntscr.com/dyxstq">http://prntscr.com/dyxstq</a>

Code CSS :

 
div.block-container {
    background-color: #efefef;
    padding: 20px;
    box-shadow: 0px 2px 4px #ccc;
    margin-bottom: 20px;
    width: 49%;
    min-height: 325px;
    float: left;
}
 
.block-container:nth-child(2n) {
    float: right;
}

Pour un support plus efficace, pensez à déclarer dans votre profil, le lien vers votre site

MickaelFR Membre non connecté

Booster Fusée

Le 22/01/2017 à 20h33

#156693

Booster Fusée
Voir le profil du membre MickaelFR
Inscrit le : 20/01/2014
Site internet
Groupes :

Whouaouuu super ! Très efficace, et je t'en remercie beaucoup.

Un dernier point. Lorsque je met lles flux en dessous les mini modules, j'ai un affichage qui part en sucette .. Je dois jouer aussi avec le ".block-MNIMODULE:nth-child(2n) {" ? OU rien à voir?

<p style="text-align:center"><a href="/upload/decalage-blocs.jpg" data-lightbox="formatter"><img src="/upload/decalage-blocs.jpg" alt="" style="max-width:150px;" /></a>[/p]

Le CSS des mini-modules :

Code CSS :

/* MODIFICATIONS pour central haut afin de partager l'affichage des modules côte à côte */
 
div#top-content .module-mini-container {
clear: none;
width: 49%;
min-height:290px;
}

Code CSS :

#module-mini-poll.module-mini-container {
    background:#efefef none repeat scroll 0 0;
    box-shadow: 0px 2px 4px #ccc;
    border:none;
    width: 49%;
    float: left;
}
 
@media (max-width: 768px) {
    #module-mini-poll.module-mini-container {
    background:#efefef none repeat scroll 0 0;
    box-shadow: 0px 2px 4px #ccc;
    border:none;
    min-width: 100%;
    float: left;
  }
}

Merci pour ces détails. <img src="/images/smileys/top.png" alt=":top" class="smiley" />

planet-truck.fr - mickaelfr.eu

babsolune Membre non connecté

Equipe Développement Administrateur

Le 22/01/2017 à 20h42

#156694

Administrateur
Voir le profil du membre babsolune
Inscrit le : 16/05/2008
Site internet
Groupes :
Equipe Développement

non c'est dû au float qui se cale contre le mini sondage parce que plus haut que le mini calendrier
il faut soit mettre une hauteur identique sur les deux minis, soit mettre le premier block-container en clear: both (et du coup le 2n en clear: none pour l'annuler)

Pour un support plus efficace, pensez à déclarer dans votre profil, le lien vers votre site

MickaelFR Membre non connecté

Booster Fusée

Le 22/01/2017 à 20h56

#156695

Booster Fusée
Voir le profil du membre MickaelFR
Inscrit le : 20/01/2014
Site internet
Groupes :

Bonsoir.

J'ai donc mis les deux mini module à la même hauteur, avec un margin-bottom de 20px pour que tout soit au même espacement

.. Je n'ai pas su faire le block-container, vu qu'il en existe qu'un seul dans le content.css et rien dans les css des modules. Je vais pas me compliquer la vie

Merci encore à toi

planet-truck.fr - mickaelfr.eu

Créations de Thèmes

Répondre

Vous n'êtes pas autorisé à écrire dans cette catégorie