webleads-tracker

logique sur les col et line du catalogue

yannick robillard
Bonjour,
j'ai un petit souci sur la logique de présentation en ligne et colonne des familles, sous-familles et short-produits.

Je veux présenter 3 elements sur par ligne sur x ligne(s) selon le nombre d'éléments.

Un enfer !!!
lorsque je change les familles au premier niveau sa me casse les sous-familles et vise-versa.

Quelqu'un a une explication à me donner pour arriver à un résultat ?

merci.


yannick robillard
Au secours ca ne marche pas !!!

j'ai mes lignes à la verticale ?!!! et mes sous-familles les unes en dessous des autres par paquet de 3.

Le cochemard !!!

yannick robillard
Voila ce que j'ai :
j'ai plusieurs ligne da sorte (id="line2" class="line2")
pourquoi class et id pour une même
?




hygiene_a_la_ferme
Hygiène à la ferme (58)


Voir la famille




machines_a_traire
Machines à traire

Voir la famille





alimentation
Alimentation

Voir la famille




yannick robillard
est voici le CSS notre_catalogue.css

/* Begin catalog/publication_methods/catalog.html */

.notre_catalogue{

}
.notre_catalogue #familly_presentation{
width:100%;
height:188px;
padding:5px;
margin: 0px auto;
background-image: url(/images/maTemplate/img_titre_catalogue/catalogue.jpg);
background-repeat:no-repeat;
background-color:#d9ecac;
border:0px solid #aab6b8;
}

.notre_catalogue #familly_presentation img{
float:left;
margin-right:5px;
}


.notre_catalogue #children_selector{}/*ne s'affiche que lorsque une famille a des produits et des sous-familles*/
#formArboSelect, #children_selector{
width:85%;
margin:auto;
}

#contents #formArboSelect fieldset{
border:0;
}


.notre_catalogue div.familly{
float:left;
width:76%;/*a regler suivant le nombre de produits par ligne*/
margin:10px 10px 10px 10px;
padding:0px;
height:166px;
position:relative;
border:1px solid #ff9900;
}
.notre_catalogue div.familly img{
margin:5px;

}
.notre_catalogue div.familly_name{
text-align:center;
color:#00b713;
border:1px solid #a3db86;
padding:0px;
background-color:#a3db86;
margin:0px 5px 0px 0px;
height:166px;
margin:0px 0px 0px 0px;
}
.notre_catalogue div.familly a{
font-weight:bolder;
color:#d9ecac;
border:4px solid #d9ecac;
padding:5px;
background-color:#00b713;
}


.notre_catalogue div#line1, .notre_catalogue div#line2, .notre_catalogue div#line3, .notre_catalogue div#line4, .notre_catalogue div#line5, .notre_catalogue div#line6{
/* pr�voir autant que de ligne il y aura si on veut des styles diff�ent par ligne*/
width:520px;
color:#00b713;
border:1px solid #ff0000;
padding:0 0 0 0;
margin:0px 0px 0px 0px;
}

.notre_catalogue div.col1, .notre_catalogue div.col2, .notre_catalogue div.col3, .notre_catalogue div.col4, .notre_catalogue div.col5,.notre_catalogue div.col6,.notre_catalogue div.col7, .notre_catalogue div.col8, .notre_catalogue div.col9, .notre_catalogue div.col10,.notre_catalogue div.col11,.notre_catalogue div.col12 {
width:150px;
margin:5px 5px 5px 5px;
padding:5px;
border:1px solid #ff0000;

}

.notre_catalogue #products .short_product {}



/* End catalog/publication_methods/catalog.html */


/*
#product_pc{


}
#product_pc h2 span{
color:#000;
font-weight:normal;
font-size:0.7em;
}
#product_pc h2{
margin-bottom:0;
}
#product_pc p{
margin-top:0;
}

#product_visuel{
text-align:center;
}
#product_visuel img{
display:inline;
margin:5px;
border:2px solid #72b1d8;
padding:1px;
}
*/
#prop_add{
margin:10px;
}
.pager{
border-top:1px solid #ccc;
padding:3px 0 0 0;
margin:10px 0 0 0;
}

Ronan Cassin [Medialibs]
Bonjour peux-tu donner des urls des pages où le problème se produit, et un scrennshot de ce que tu souhaiterais voir.

Merci
La sagesse du futur, celle qui évitera le suicide de l'humanité, ne consistera plus à gagner du temps mais à le remplir, à le vivre, à en prendre toute la mesure.
[Jacques Attali]

yannick robillard
Bonjour Romain.
Le site est pleine intégration.
j'ai un catalogue un peu complexe , je m'explique :
racine :
- famille1 (1 couleur)
---- sous-famille
---------- produit
---------- produit
---------- produit
---------- produit
---------- produit
---------- produit
---- sous-famille
---------- produit
---------- produit
---------- produit
---------- produit
---------- produit
---- sous-famille
---------- produit
---------- produit
---------- produit
---------- produit
---------- produit
---------- produit
---- sous-famille
- famille2 (1 couleur)
---- sous-famille
---------- produit
---- sous-famille
---- sous-famille
---- sous-famille
- famille3 (1 couleur)
---- sous-famille
---- sous-famille
---- sous-famille
---- sous-famille
- famille4 (1 couleur)
---- sous-famille
---- sous-famille
---- sous-famille
---- sous-famille
- famille5 (1 couleur)
---- sous-famille
---- sous-famille
---- sous-famille
---- sous-famille

ce que je veux c'est pour chaque famille :
- que les sous-familles soient présentées en ligne de trois éléments sur un content de 520px
- pour les sous-sous familles idem
- pour les sous-sous-sous familles idem
- pour les short-product idem


lien du site en developpement :
http://agrileader.atester.fr/notre-catalogue/

merci

yannick robillard
sur IE 7 je vous dis pas !! tout explosé
sur IE6 encore pire.


Ronan Cassin [Medialibs]
Voilà j'ai commencé à te débloquer la situation ...

Par contre pour commencer (et y voir plus clair) j'ai commenté l'appel à tes feuilles de styles spécifiques à certaines familles du catalogue.
Ensuite j'ai rajouter dans le template catalogue.html, deux class "ligne" et "colonne", plutôt que de travailler avec des line1, line2, etc ... cela sera plus simple étant donné ce que tu souhaites faire.

Les modification apportées sont donc :

div.ligne{
clear:left;
padding:10px 0 0 0;
width: 530px;
}
div.familly{
margin:10px 10px 0 0;
}


voilà je pense que maintenant tu vas pouvoir avancer tout seul.
La sagesse du futur, celle qui évitera le suicide de l'humanité, ne consistera plus à gagner du temps mais à le remplir, à le vivre, à en prendre toute la mesure.
[Jacques Attali]