Mise en forme cadre widget

[Ombeline30]

Détails techniques

Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://voyances-ombeline.forumgratuit.be/

Description du problème

Bonjour,

J'en reviens vers vous de nouveau après de multiples essais infructueux que je ne m'explique pas

Donc en gros je souhaiterais arrondir le cadre de mon widget "sujets récents" j'ai essayé avec la donnée border-radius associée à une fois .module, une fois .marquee, une fois #left et bien d'autres … mais rien n'y a fait et aussi j'ai rencontré un souci pour y attribuer un "borde"r que j'ai associé à #left  et qui est le seul à le prendre mais il y a un dépassement bizarre au bas du cadre (faites bien attention car cela donne sur le wallpaper et donc c'est très subtil à voir) cnfr image ci-dessous :


Je vous remercie d'avance beaucoup pour votre précieuse aide ^^

Belle fin de week-end,

Ombeline.

[◦Jay◦]

Bonjour Ombeline, essayez ceci :

Code:

.forumline.genmed .row1 {border-bottom-left-radius:20px !important;
border-bottom-right-radius:20px !important;}
.forumline.genmed .catLeft {border-top-left-radius:20px !important;
border-top-right-radius:20px !important;}

Vous pourrez ajouter un border comme vous le souhaitez, s'il y a un problème, merci de mettre votre widget visible aux invités que je puisse le voir.

Bien à vous.

[Ombeline30]

Bonjour Jay,

Voilà encore une fois mon sauveur ça a bien marché j'ai essayé les diverses parties que vous m'avez fournies mais séparément et non ensemble, cela dit il n'y a qu'un petit couac qui persiste je vous le mets en image :


Comme vous pouvez le voir aux 4 coins arrondis il y a des coins beiges si vous pouvez m'aider à les ôter ce serait très gentil ^^

Encore un immense merci pour votre précieuse aide comme toujours 

[◦Jay◦]

Coucou Ombeline, pouvez-vous mettre le widget visible aux invités s'il vous plait ?

[Ombeline30]

Oui oui je le fais de suite ^^

[Ombeline30]

Voilà qui est fait ^^

[◦Jay◦]

Voila, si cela vous convient :

Code:

.forumline.genmed{background-color:transparent !important ;}

[Ombeline30]

Ah zut j'avais bien essayé avec le même background mais j'avais omis certains éléments sinon c'est bon c'est parti il persiste juste encore un écart entre le titre et le cadre si vous voyez ?

[◦Jay◦]

Oui, donc, retirez tout ce que vous avez mis depuis ce matin et essayez comme ceci :

Code:

.forumline.genmed{background-color:transparent !important ;
border-spacing :2px 0;}
.forumline.genmed .row1 {border-bottom-left-radius:20px !important;
border-bottom-right-radius:20px !important;}
.forumline.genmed .catLeft {border-top-left-radius:20px !important;
border-top-right-radius:20px !important;
margin-top:2px !important ;
border:1px ;
}

[Ombeline30]

Merci Jay c'est parfait juste pour le contour où dois-je rajouter ceci s'il vous plaît :

border: 1px solid #c19161;

[◦Jay◦]

Ah oui, il faudrait donc le mettre en deux fois, le code complet serait :

Code:

.forumline.genmed{background-color:transparent !important ;
border-spacing :2px 0;}
.forumline.genmed .row1 {border-bottom-left-radius:20px !important;
border-bottom-right-radius:20px !important;
border-bottom: 1px solid #c19161;
border-left: 1px solid #c19161;
border-right: 1px solid #c19161;}
.forumline.genmed .catLeft {border-top-left-radius:20px !important;
border-top-right-radius:20px !important;
margin-top:2px !important ;
border-top: 1px solid #c19161;
border-left: 1px solid #c19161;
border-right: 1px solid #c19161;
}

En remplacement du code précédent. Retirez le précédent dans son intégralité et mettez celui-ci.

[◦Jay◦]

Personnellement, j'aurai peut-être essayé avec 2px, comme ceci :

Code:

.forumline.genmed{background-color:transparent !important ;
border-spacing :2px 0;}
.forumline.genmed .row1 {border-bottom-left-radius:20px !important;
border-bottom-right-radius:20px !important;
border-bottom: 2px solid #c19161;
border-left: 2px solid #c19161;
border-right: 2px solid #c19161;}
.forumline.genmed .catLeft {border-top-left-radius:20px !important;
border-top-right-radius:20px !important;
margin-top:2px !important ;
border-top: 2px solid #c19161;
border-left: 2px solid #c19161;
border-right: 2px solid #c19161;
}

[Ombeline30]

Superrrrrrrrrrrrrr on y est presque en effet ça rend mieux et y aurait-il moyen également de mettre le trait en guise de séparation entre le titre (cadre sombre) et le cadre avec les sujets ?

[◦Jay◦]

Bah justement, je l'avais supprimé car je pensais que vous n'en vouliez pas !

Donc, un border à 2px avec séparation à 1 px :

Code:

.forumline.genmed{background-color:transparent !important ;
border-spacing :2px 0;}
.forumline.genmed .row1 {border-bottom-left-radius:20px !important;
border-bottom-right-radius:20px !important;
border-bottom: 2px solid #c19161;
border-left: 2px solid #c19161;
border-right: 2px solid #c19161;}
.forumline.genmed .catLeft {border-top-left-radius:20px !important;
border-top-right-radius:20px !important;
margin-top:2px !important ;
border-top: 2px solid #c19161;
border-left: 2px solid #c19161;
border-right: 2px solid #c19161;
border-bottom: 1px solid #c19161;
}

Ou border à 2px et séparation 2 px aussi :

Code:

.forumline.genmed{background-color:transparent !important ;
border-spacing :2px 0;}
.forumline.genmed .row1 {border-bottom-left-radius:20px !important;
border-bottom-right-radius:20px !important;
border-bottom: 2px solid #c19161;
border-left: 2px solid #c19161;
border-right: 2px solid #c19161;}
.forumline.genmed .catLeft {border-top-left-radius:20px !important;
border-top-right-radius:20px !important;
margin-top:2px !important ;
border: 2px solid #c19161;
}

Et tous les border à 1px :

Code:

.forumline.genmed{background-color:transparent !important ;
border-spacing :2px 0;}
.forumline.genmed .row1 {border-bottom-left-radius:20px !important;
border-bottom-right-radius:20px !important;
border-bottom: 1px solid #c19161;
border-left: 1px solid #c19161;
border-right: 1px solid #c19161;}
.forumline.genmed .catLeft {border-top-left-radius:20px !important;
border-top-right-radius:20px !important;
margin-top:2px !important ;
border: 1px solid #c19161;
}

A vous de choisir.

[Ombeline30]

Rhoooooo ben dis donc quel travail encore une fois un immense merci Jay j'espère un jour devenir aussi douée que vous l'êtes, c'est parfait je place en résolu ^^

Au plaisir,

Beau dimanche à vous,

À tout bientôt 

[◦Jay◦]

Avec plaisir.

@Bientôt.

[Ombeline30]