[Problème] K2 - Présentation par liste de catégories

[Gfly30]

Bonjour,

J'utilise K2 pour présenter une série d'articles, 1 en en-tête, les suivants 2 par ligne.

J'ai pu mettre une petite ligne de séparation vers le bas (border-bottom), mais j'aimerais mettre une ligne de séparation au milieu, entre 2 articles.

Si je mets un border-right, il apparaît aux deux articles... Mon besoin est que la ligne apparaisse uniquement au milieu, ou soit sur le border right sur l'article de gauche...

Si quelqu'un à une idée, j'ai le sentiment que cela doit être plus "profond" qu'un simple border- .... ?

Merci

[lefabdu51]

Re : K2 - Présentation par liste de catégories

tu la met sur quelle classe ta bordure?

la c est tout depend du template, donc dur de repondre sans lien vers le site...

[wabaw]

Re : K2 - Présentation par liste de catégories

Bonjour, avec la pseudo classe CSS first-child tu devrais pouvoir régler cela :

http://www.w3schools.com/cssref/sel_firstchild.asp

Il faut juste pouvoir s'appuyer sur ton code et voir comme le dit lefabdu51 avec ta Template.

[Gfly30]

Re : K2 - Présentation par liste de catégories

Merci pour vos réponses. Je met le site en ligne pour la journée. Le template est LimaLifestyle.

La page en question est : http://www.fitperformance.ch/index.p...ences-athletes
(Aussi les 3 pages références média)

Merci de l'aide. J'ai beaucoup cherché, et je pense que c'est une question qui peut être récurrente pour bcp de monde.

N'y a t'il pas sur le marché des "modèles", hors templates de mise en page d'articles K2 ?¿

Merci d'avance et bonne journée

[wabaw]

Re : K2 - Présentation par liste de catégories

Une piste serait comme de faire ceci :

div.catItemView {
    background: #f3f3f3 none repeat scroll 0 0;
    color: #333;
    margin: 10px;
    padding: 10px;
}

Cela a le mérite de séparer les articles comme des fiches, mais dans l'article "Et tous les autres" ta liste est à modifier car elle n'a pas de padding, donc elle va coller au bloc gris :

div.catItemView ul {
    padding-right: 40px;
}

[Gfly30]

Re : K2 - Présentation par liste de catégories

Je vais essayer cela. Sauf que c'est pas un background que je cherche mais un border solid gris au milieu.... Je pense que la piste est bonne.

Logiquement, je met cela dans k2.css ?

Merci en tout les cas!

[wabaw]

Re : K2 - Présentation par liste de catégories

Oui, c'est vrai que j'ai habilement détournée ta question pour y répondre par autre choses
Tu dois pouvoir y arriver car le dernier article de chaque rangée a une classe .itemContainerLast ce qui te permet dans le principe de n'appliquer ta border-left: 1px solid #e6e6e6; qu'aux articles de droite.
Mais il y a plus de travail niveau CSS...

[Gfly30]

Re : K2 - Présentation par liste de catégories

Ok, si je comprend bien .itemContainerLast est forcément le dernier de la ligne, que j'en affiche, 2, 3, 4 ... sur une ligne...

Et donc .itemContainer tout court est forcément celui de devant. C'est bien cela ?

[wabaw]

Re : K2 - Présentation par liste de catégories

En fait une ligne est constituée de deux DIV, les deux avec la classe .itemContainer, et le dernier de chaque ligne a en plus la classe .itemContainerLast.

<div style="width:50.0%;" class="itemContainer">
<div style="width:50.0%;" class="itemContainer itemContainerLast">

Mais ton article d'intro a aussi les deux classes :

<div class="itemContainer itemContainerLast">

Donc, avec .itemContainer tous tes blocs seront atteints, et avec .itemContainerLast le dernier de chaque ligne sera atteint (même s'il est seul sur la ligne.)

Inspectes le code avec FireBug sur Firefox ou avec l’inspecteur dans chrome et tu verra la structure de ta page. Cela te permettra de voir comment c'est construit et avec un peu ou pas mal de CSS tu arriveras à tes fins.

[Gfly30]

Re : K2 - Présentation par liste de catégories

Je regarderai tout à l'heure, mais jai bien compris Et comme le dernier de chaque liste est atteint avec _last, j'y colle un border-left, ainsi la séparation se trouve au milieu...

Je test et redis.

Merci

[Gfly30]

Re : K2 - Présentation par liste de catégories

Pas mal, ca marche bien, le border right est bien là, 1 article sur 2, mais il ne sont plus en ligne... Tout en hauteur ?? Une histoire de padding ?

J'a essayé de rajouter

<div style="width:40.0%;" class="itemContainer">
<div style="width:40.0%;" class="itemContainer itemContainerLast">

Pour voir si c'est question de place, mais non... Que faire ? Et merci du temps consacré

[wabaw]

Re : K2 - Présentation par liste de catégories

Oui c'est le souci, tes articles n'ont pas la même hauteur et du coup décalage... J'en reviens a mon background-color qui fait le job d'une,manière assez propre.��

[Gfly30]

Re : K2 - Présentation par liste de catégories

Oki, je comprend. Oui j'avais testé la solution comme des "fiches" j'aime assez, j'y revient.

Du coup je savais pas faire du vrais gris "light", le eeeeew me paraissait trop foncé, j'ai appris à le nuancé.

Là c'est top je trouve.

Merci beaucoup et bonne continuation....

NB : Comment je met le post en résolu ??