Cadre Vert des Modérateurs
3 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Cadre Vert des Modérateurs
Détails techniques
Version du forum : phpBB3Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari, Autre
Personnes concernées par le problème : Tous les Utilisateurs
Lien du forum : http://futurhabbo-marinette.forumactif.org
Description du problème
Bonjour,J'ai eu une réponse par Chacha sur la réponse de Comment faire le cadre des modérateurs mais elle m'a envoyé sur une page de l'ancien code.
J'ai essayé de le trafiquer pour essayer de faire le même que vous ^^, mais j'y arrive pas :c
Alors voilà, j'aimerais savoir si il est possible de l'avoir ou pas.
Merci,
Très Cordialement,
julie10902
Dernière édition par julie10902 le Jeu 8 Déc 2016 - 20:31, édité 1 fois
Invité- Invité
Re: Cadre Vert des Modérateurs
UP, pas eu de réponse
@Chacha, @Tech, @Walt, @Leeloo
@Chacha, @Tech, @Walt, @Leeloo
Invité- Invité
Re: Cadre Vert des Modérateurs
Up Up UP
@Chacha
@Tech
@Walt
@Leeloo
Répondez s'il vous plaît
@Chacha
@Tech
@Walt
@Leeloo
Répondez s'il vous plaît
Invité- Invité
Re: Cadre Vert des Modérateurs
Bonjour,
Pourriez-vous nous fournir vos codes HTML et CSS actuels ainsi que les effets désirés et manquants ?
Cordialement.
Pourriez-vous nous fournir vos codes HTML et CSS actuels ainsi que les effets désirés et manquants ?
Cordialement.
Re: Cadre Vert des Modérateurs
Bonjour et merci beaucoup (énormément) de votre réponse @Tech
Alors en fait j'ai l'ancien cadre des modérateurs (de ForumActif) mais je souhaiterais avoir le nouveau code ^^
Alors voici des codes et images :
Cadre ancien (seulement image car le code, j'en donne un un peu modifié)
Nouveau Cadre (Attention, c'est le code modifié mais j'arrive pas à faire la même couleur et forme que vous)
Image du Cadre désiré :
Code modifié par moi pour essayer d'obtenir le cadre de l'image ci dessus
Code CSS
Image du cadre obtenu (loin du résultat ^^)
Très Cordialement, julie10902
PS : En soit, j'aimerais genre la même forme, même couleur, le même cadre ^^
Alors en fait j'ai l'ancien cadre des modérateurs (de ForumActif) mais je souhaiterais avoir le nouveau code ^^
Alors voici des codes et images :
Cadre ancien (seulement image car le code, j'en donne un un peu modifié)
- Image Ancien Cadre:
Nouveau Cadre (Attention, c'est le code modifié mais j'arrive pas à faire la même couleur et forme que vous)
Image du Cadre désiré :
- Image Cadre désiré:
Code modifié par moi pour essayer d'obtenir le cadre de l'image ci dessus
Code CSS
- Code:
.cadre1 {background: green; border: 3px solid green; color: white; font-weight: bold; width: 80%; margin: auto;}
- Code:
[table class="cadre1"][tr][td]TEXTE[/td]
[/tr]
[/table]
Image du cadre obtenu (loin du résultat ^^)
- Cadre obtenu:
Très Cordialement, julie10902
PS : En soit, j'aimerais genre la même forme, même couleur, le même cadre ^^
Dernière édition par julie10902 le Mer 30 Nov 2016 - 20:39, édité 1 fois
Invité- Invité
Re: Cadre Vert des Modérateurs
UP @Tech
Désolé je UP 20 minutes avant 24 heures ^^
Désolé je UP 20 minutes avant 24 heures ^^
Invité- Invité
Re: Cadre Vert des Modérateurs
UP ^^
@Tech
@Tech
Invité- Invité
Re: Cadre Vert des Modérateurs
Up
@Tech
@Tech
Invité- Invité
Re: Cadre Vert des Modérateurs
Bonsoir,
Vous donner le code tout fait serait inutile. Je vais donc vous donner les informations pour reproduire vous-même l'effet voulu.
- Pour arrondir les angles, il faut utiliser la propriété border-radius. Voici les informations concernant cette balise : https://developer.mozilla.org/fr/docs/Web/CSS/border-radius
- Pour décaler la trame vers la gauche, il faut utiliser la propriété margin, et plus précisément margin-left. Les nombres négatifs sont nécessaires dans ce cas. Plus d'infos : https://developer.mozilla.org/fr/docs/Web/CSS/margin et https://developer.mozilla.org/fr/docs/Web/CSS/margin-left
- Pour créer l'effet en bas à gauche qui "revient", c'est plus compliqué. Il faut utiliser la notation ::before
Je vous donne le code de cette partie :
N'hésitez pas à revenir vers moi en cas de problèmes ou de questions.
Cordialement.
Vous donner le code tout fait serait inutile. Je vais donc vous donner les informations pour reproduire vous-même l'effet voulu.
- Pour arrondir les angles, il faut utiliser la propriété border-radius. Voici les informations concernant cette balise : https://developer.mozilla.org/fr/docs/Web/CSS/border-radius
- Pour décaler la trame vers la gauche, il faut utiliser la propriété margin, et plus précisément margin-left. Les nombres négatifs sont nécessaires dans ce cas. Plus d'infos : https://developer.mozilla.org/fr/docs/Web/CSS/margin et https://developer.mozilla.org/fr/docs/Web/CSS/margin-left
- Pour créer l'effet en bas à gauche qui "revient", c'est plus compliqué. Il faut utiliser la notation ::before
Je vous donne le code de cette partie :
- Code:
.cadre1::before {
border-color: transparent green transparent transparent;
border-style: solid;
border-width: 0 4px 7px 0;
bottom: -7px;
content: " ";
display: block;
height: 0;
left: 6px;
position: absolute;
width: 0;
}
N'hésitez pas à revenir vers moi en cas de problèmes ou de questions.
Cordialement.
Re: Cadre Vert des Modérateurs
D'accord merci mais ça je le remplace dans le code que j'ai déja ?
Et aussi, si on veut que les deux bords rond de droites et pas tous?
Sinon merci de la réponse @Tech
Et aussi, si on veut que les deux bords rond de droites et pas tous?
Sinon merci de la réponse @Tech
Invité- Invité
Re: Cadre Vert des Modérateurs
Vous pouvez les rajouter à votre code actuel. Concernant votre question concernant les coins droits, c'est clairement marqué dans la page que je vous ai fournie.
- Code:
/* 1. coin en haut à gauche */
/* 2. coin en haut à droite */
/* 3. coin en bas à droite */
/* 4. coin en bas à gauche */
border-radius: 1px 0 3px 4px;
Re: Cadre Vert des Modérateurs
Ah d'accord merci beaucoup.
Je vais le réaliser sur le forum et mettrai résolu si j'y suis parvenu
Sinon merci encore de votre réponse
Je vais le réaliser sur le forum et mettrai résolu si j'y suis parvenu
Sinon merci encore de votre réponse
Invité- Invité
Re: Cadre Vert des Modérateurs
Voilà j'ai refait le code et ça me donne quelque chose de bizarre (attendu mais bizarre)
Le code :
J'ai également essayé comme ça mais rien ne change ^^ :
Je viens d'essayer quelque chose de nouveau et le mettrai de main.
Nouveau Code :
Le lien ou je l'ai mis effectif : Lien
Voilà, pour résumer, il me manque seulement le code (margin-left) pour mettre le cadre à gauche (et non le texte) et le ::before qui ne fonctionne pas.
Le code :
- Code:
.cadre1 {background: #68B800; border-radius: 0 10px 10px 0; border: 3px solid #68B800; color: white; font-weight: bold; width: 80%; margin-left: -10px;}
::before {
border-color: transparent green transparent transparent;
border-style: solid;
border-width: 0 4px 7px 0;
bottom: -7px;
content: " ";
display: block;
height: 0;
left: 6px;
position: absolute;
width: 0;
}
J'ai également essayé comme ça mais rien ne change ^^ :
- Code:
.cadre1 {background: #68B800; border-radius: 0 10px 10px 0; border: 3px solid #68B800; color: white; font-weight: bold; width: 80%; margin-left: -10px;}::before {border-color: transparent green transparent transparent; border-style: solid; border-width: 0 4px 7px 0; bottom: -7px; content: " "; display: block; height: 0; left: 6px; position: absolute; width: 0;}
Je viens d'essayer quelque chose de nouveau et le mettrai de main.
Nouveau Code :
- Nouveau code + indications:
- Code:
.cadre1 {background: #68B800; border-radius: 0 10px 10px 0; border: 3px solid #68B800; color: white; font-weight: ; width: 80%; margin-left: 0;}
.cadre1::before {border-color: transparent green transparent transparent; border-style: solid; border-width: 0 4px 7px 0; bottom: -7px; content: " "; display: block; height: 0; left: 6px; position: absolute; width: 0;}
Le lien ou je l'ai mis effectif : Lien
Voilà, pour résumer, il me manque seulement le code (margin-left) pour mettre le cadre à gauche (et non le texte) et le ::before qui ne fonctionne pas.
Dernière édition par julie10902 le Dim 4 Déc 2016 - 11:53, édité 2 fois
Invité- Invité
Invité- Invité
Re: Cadre Vert des Modérateurs
Bonjour julie10902,
De votre lien
en supprimant à votre css le margin-left de la classe cadre1 on obtient ceci
Est-ce le résultat souhaité?
De votre lien
en supprimant à votre css le margin-left de la classe cadre1 on obtient ceci
Est-ce le résultat souhaité?
Re: Cadre Vert des Modérateurs
Merci de vos recherches (je ne sais pas comment vous avez modifié mon forum sans le modifier ^^) mais, c’est cela que je recherche (merci beaucoup) mais je recherche en plus le cadre qui "sort" du forum vers la gauche, et apparemment, c'était avec le margin-left mais non.
J'y comprends plus rien
Encore merci @MasDan
J'y comprends plus rien
Encore merci @MasDan
Invité- Invité
Re: Cadre Vert des Modérateurs
julie10902 a écrit:Voilà j'ai refait le code et ça me donne quelque chose de bizarre (attendu mais bizarre)
Le code :
- Code:
.cadre1 {background: #68B800; border-radius: 0 10px 10px 0; border: 3px solid #68B800; color: white; font-weight: ; width: 80%; margin-left: -10px;}
::before {
border-color: transparent green transparent transparent;
border-style: solid;
border-width: 0 4px 7px 0;
bottom: -7px;
content: " ";
display: block;
height: 0;
left: 6px;
position: absolute;
width: 0;
}
J'ai également essayé comme ça mais rien ne change ^^ :
- Code:
.cadre1 {background: #68B800; border-radius: 0 10px 10px 0; border: 3px solid #68B800; color: white; font-weight: ; width: 80%; margin-left: -10px;}::before {border-color: transparent green transparent transparent; border-style: solid; border-width: 0 4px 7px 0; bottom: -7px; content: " "; display: block; height: 0; left: 6px; position: absolute; width: 0;}
Je viens d'essayer quelque chose de nouveau et le mettrai de main.
Le lien ou je l'ai mis effectif : Lien
Édit : j'ai modifié les 2 codes avec les informations qu'il y a sur mon forum. Attention, je rajouterai un code demain prototype.
Invité- Invité
Re: Cadre Vert des Modérateurs
Voilà le nouveau codejulie10902 a écrit:Voilà j'ai refait le code et ça me donne quelque chose de bizarre (attendu mais bizarre)
Le code :
- Code:
.cadre1 {background: #68B800; border-radius: 0 10px 10px 0; border: 3px solid #68B800; color: white; font-weight: bold; width: 80%; margin-left: -10px;}
::before {
border-color: transparent green transparent transparent;
border-style: solid;
border-width: 0 4px 7px 0;
bottom: -7px;
content: " ";
display: block;
height: 0;
left: 6px;
position: absolute;
width: 0;
}
J'ai également essayé comme ça mais rien ne change ^^ :
- Code:
.cadre1 {background: #68B800; border-radius: 0 10px 10px 0; border: 3px solid #68B800; color: white; font-weight: bold; width: 80%; margin-left: -10px;}::before {border-color: transparent green transparent transparent; border-style: solid; border-width: 0 4px 7px 0; bottom: -7px; content: " "; display: block; height: 0; left: 6px; position: absolute; width: 0;}
Je viens d'essayer quelque chose de nouveau et le mettrai de main.
Nouveau Code :J'ai enlevé le Bold dans le font-weight, le margin-left décale mon texte mais pas le cadre alors du coup j'aimerais savoir comment décaler le cadre donc du coup je l'ai enlevé (mis à 0) et j'ai rien touché au ::before mais il fais des figures bizarres sur le forum (je sais que c'est le ::before car je l'ai modifié [les nombres] et ça bougeait les formes bizarres).
- Code:
.cadre1 {background: #68B800; border-radius: 0 10px 10px 0; border: 3px solid #68B800; color: white; font-weight: ; width: 90%; margin-left: -10; margin-top: 10; position: relative;}
.cadre1::before {border-color: transparent green transparent transparent; border-style: solid; border-width: 0 4px 7px 0; bottom: -7px; content: " "; display: block; height: 0; left: 6px; position: absolute; width: 0;}
Le lien ou je l'ai mis effectif : Lien
Voilà, pour résumer, il me manque seulement le code (margin-left) pour mettre le cadre à gauche (et non le texte) et le ::before qui ne fonctionne pas.
Dernière édition par julie10902 le Dim 4 Déc 2016 - 12:52, édité 1 fois
Invité- Invité
Re: Cadre Vert des Modérateurs
J'ai compris, pour que le cadre revienne en arrière, il suffit de modifier le "overflow" du CSS général de base du forum dans le .content
En fait, vous cliquez sur Voir le CSS de base du forum puis vous faites CTRL+f puis tapez .content et vous allez au 8 puis vous voyez overflow et faut le mettre en "visible" au lieu de "hidden"
J'ai modifié ma page via le CTRL+MAJ+I et j'ai enlevé le hidden, puis le cadre s'est décalé, alors il faudrait que je sache comment modifier ce dossier ?
- Image:
En fait, vous cliquez sur Voir le CSS de base du forum puis vous faites CTRL+f puis tapez .content et vous allez au 8 puis vous voyez overflow et faut le mettre en "visible" au lieu de "hidden"
J'ai modifié ma page via le CTRL+MAJ+I et j'ai enlevé le hidden, puis le cadre s'est décalé, alors il faudrait que je sache comment modifier ce dossier ?
Invité- Invité
Re: Cadre Vert des Modérateurs
UP @Tech
Invité- Invité
Re: Cadre Vert des Modérateurs
Hello o/
Vous souhaiteriez retirer définitivement ce overflow: hidden, c'est bien ça ?
Vous souhaiteriez retirer définitivement ce overflow: hidden, c'est bien ça ?
ZYVHK- ***
-
Messages : 134
Inscrit(e) le : 05/03/2016
Re: Cadre Vert des Modérateurs
Oui c'est en quelque sorte ça ^^
Invité- Invité
Re: Cadre Vert des Modérateurs
Je viens de trafiquer un peu le code et j'ai réussi à faire à peu près la même chose.
Dîtes moi si le code est bon ou pas et le lien d'application du code est : Lien
Dîtes moi si le code est bon ou pas et le lien d'application du code est : Lien
- Code:
.cadre1 {background: #68B800; border-radius: 0 10px 10px 0; border: ; color: white; font-weight: ; width: 55%; margin-left: -25; margin-top: 10; position: absolute;}
.cadre1::before {border-color: transparent green transparent transparent; border-style: solid; border-width: 0 4px 7px 0; bottom: -7px; content: " "; display: block; height: 0; left: 6px; position: absolute; width: 0;}
Invité- Invité
Re: Cadre Vert des Modérateurs
Ça m'a l'air correct. Après, si vous voulez ajouter une image à gauche, il suffirait d'ajouter un peu de padding-left et un background-image sur ton cadre éventuellement. Tu peux également simplement mettre l'image tel quel avec un float.
- Code:
<img src="lien de l'image" style="float: left;" />
ZYVHK- ***
-
Messages : 134
Inscrit(e) le : 05/03/2016
Re: Cadre Vert des Modérateurs
Ah d'accord merci, je vais voir tout de suite et je mettrai une réponse.
Sinon je suis très fière de moi car j'ai réussie à trouver quasi seule le code ^^
Merci beaucoup @Arcadia-forum
Sinon je suis très fière de moi car j'ai réussie à trouver quasi seule le code ^^
Merci beaucoup @Arcadia-forum
Invité- Invité
Re: Cadre Vert des Modérateurs
Oui merci ça marche, manque plus qu'à changer la couleur du fond pour en faire plusieurs mais ça ça va être facile ^^
Je reviendrai vers vous en cas de problème avec ce cadre très spécial
Merci beaucoup aux personnes qui m'auront aidés et à Tech.
Je reviendrai vers vous en cas de problème avec ce cadre très spécial
Merci beaucoup aux personnes qui m'auront aidés et à Tech.
Invité- Invité
Re: Cadre Vert des Modérateurs
J'avais oublié de mettre ce sujet en résolu, excusez moi de cet oubli.
Invité- Invité
Sujets similaires
» Supprimer "Modérateurs: Modérateurs, Secrétaire"
» Cadre vert ou rouge pour sanctions et autres.
» Comment enlever le mot "modérateurs" et/ou les noms de modérateurs dans les intitulés des forums sur la page d'acceuil
» Bandeau "en ligne" en vert?
» Comment enlever modérateurs: modérateurs.
» Cadre vert ou rouge pour sanctions et autres.
» Comment enlever le mot "modérateurs" et/ou les noms de modérateurs dans les intitulés des forums sur la page d'acceuil
» Bandeau "en ligne" en vert?
» Comment enlever modérateurs: modérateurs.
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum