Sous-forum en code (encadré?)

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Sous-forum en code (encadré?)

Message par Lumélys le Ven 30 Déc 2011 - 1:56

Je ne sais pas comment expliqué ca mais je voudrais savoir comment on fait pour avoir ca sur notre forum. Ce que les forums sont marqués mais ils sont légèrement encadré par une couleur plus pâle que le forum.
Comme celui-ci:
http://twilight-fascination.superforum.fr/
Je vous entoure ce que je parle:
Spoiler:
C'est ce qui est encerclé en un genre de rose pêche.
Merci beaucoup pour votre aide^^


Dernière édition par Lumélys le Dim 1 Jan 2012 - 0:17, édité 2 fois

Lumélys
***

Féminin
Messages : 131
Inscrit(e) le : 13/08/2009

http://dimensionsarts.forum-canada.com/
Lumélys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Tsukiyo Yume le Ven 30 Déc 2011 - 6:48

Je vais te donner un code rapide, mais je pense que ça peut se faire dans le css... m'enfin, dans la description de ta catégorie essai ça:

Code:
<ul><div style="width: 75% ; text-align: justify">
texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte
</div></ul>

Edite: Et comme je saute souvent des truc, la reine des tâches a oublié comment faire pour l'encadrement. Si quelqu'un est plus rapide que moi pour trouver tant mieux, sinon je tenterais de fouiller un peu plus dans ma mémoire de poisson ._.

Tsukiyo Yume
**

Féminin
Messages : 74
Inscrit(e) le : 09/03/2011

http://hybrid-fascination.forum-canada.com/
Tsukiyo Yume a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Milouze14 le Ven 30 Déc 2011 - 8:28

Salut Lumélys,

pour le code Html:
Attribut une class comme celle-ci "contour":
Le code déjà en fonction:
Code:

<div class="contour">C'est ici que vous venez vous présenter. Vous pourrez voir la catégories du forum mais seulement en apparence. Sans être validé vous ne pourrez pas aller voir ce qui se cache derrière celles-ci. N'oubliez pas le code ^^.
</div>

Dans ta feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Code:
.contour
{
  border:2px solid #F08080;
  margin-left:2%;
  margin-right:2%;
  padding:4px;
}

La couleur de la bordure se rapproche de celle que tu désires.
Augmente ou diminue l'épaisseur de la bordure dans border:
margin-left et margin-right concerne la marge gauche et droite
padding correspond à l'espace entre le cadre et le texte.

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Lumélys le Sam 31 Déc 2011 - 23:44

Ah super je vois un rectangle.
Mais c'était pas ce que je voulais. C'est le genre de brume gris à l'intérieur. Le rectangle beige-rose c'est pour vous montrer ce que c'est ^^'
Merci ^^

Lumélys
***

Féminin
Messages : 131
Inscrit(e) le : 13/08/2009

http://dimensionsarts.forum-canada.com/
Lumélys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Milouze14 le Dim 1 Jan 2012 - 10:24

Re,
c'est une opacité qu'il te faut pour avoir une apparence de brume.
Supprimes la class contour dans ta feuille de style et remplaces par celle-ci:
Code:
  .contour
        {
          border:2px solid #F08080;
          margin-left:2%;
          margin-right:2%;
          padding:4px;
  opacity : 0.5;
    -moz-opacity : 0.5;
    -ms-filter: "alpha(opacity=50)"; /* IE 8 */
    filter : alpha(opacity=50); /* IE < 8 */
        }
augmente ou diminue les valeurs à l'identique:
Exemple avec une opacité de 0.8:
Code:
opacity : 0.8;
 -moz-opacity : 0.8;
 -ms-filter: "alpha(opacity=80)";
 filter : alpha(opacity=80); 

Plus les valeurs sont importantes et moins l'opacité sera visible:
Tu peux également mettre un hover: (survol du cadre):
Code:
  .contour:hover
        {
          border:2px solid #F08080;
          margin-left:2%;
          margin-right:2%;
          padding:4px;
  opacity : 0.4;
    -moz-opacity : 0.4;
    -ms-filter: "alpha(opacity=40)"; /* IE 8 */
    filter : alpha(opacity=40); /* IE < 8 */
        }

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Lumélys le Mar 3 Jan 2012 - 6:16

Coucou
sans que rien se modifie sauf cette partie, par quoi dois-je le remplacer dans ce CSS?
Code:
a:link,a:active,a:visited {
        text-decoration: none;
    }

body {
background-repeat: no-repeat;
background-position: top center;
background-image: ("http://nsa21.casimages.com/img/2010/09/26/100926031218244814.png")
}body

td.row1{
background-image: url("http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png");
}
td.row2{
background-image: url("http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png");
}
td.row3{
background-image: url("http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png");
}
td.row3Right{background-image : url(http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png);}

.forumline{
    border: 1px #4f6b6a solid;
    }
a.forumlink {
font-weight: lighter !important;
text-decoration: none;
font-variant:small-caps;
border-bottom: 1px #648786 solid;
   text-align: center;
}

a.forumlink:hover {
text-decoration: none;
font-variant:small-caps;
   text-align: center;
}
.nav{
    font-size: 12px;
font-weight: lighter !important;
text-decoration: none;
    }
a.nav{
font-weight: lighter !important;
text-decoration: none;
    }
a.nav:hover{
text-decoration: none;
    }
.topictitle,h1,h2{
    font-weight: lighter !important;
    }
h2.topic-title {
   display: inline;
    margin: 6;
    padding: 6;
   }
.secondarytitle,.secondarytitle h2 {
    font-weight: lighter !important;
   }
.cattitle{
    font-weight: lighter !important;
   text-align: center;
}




a.forumlink
{
display: block;
padding-left: 10px;
font-size: 14px;
font-family: Kalinga;
letter-spacing: 3px;
border-bottom: 3px solid #000000;
border-left: 3px solid #000000;
border-radius: 15px;
-moz-border-radius: 15px;
-htm-border-radius: 15px;
-webkit-border-radius: 15px;
-o-border-radius: 15px;
color: #FFFFFF !important;
text-shadow: 2px 1px 4px #e6dddd;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
a.forumlink:hover
{
padding-left: 30px;
text-transform: uppercase;
border-bottom: 4px solid #c6addb;
border-left: 4px solid #c6addb;
color: #FFFFFF !important;
text-shadow: 2px 2px 3px #000000;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
.forumline
{
width: 95%;
margin: auto;
background-color: #000000;
border-top: 2px solid #000000;
border-bottom: 2px solid #000000;
padding: 2px;
}
#cate_foot
{
width: 900px;
height: 1000px;
margin: auto;
background: url(http://img11.hostingpics.net/pics/139213category04.jpg) center no-repeat;
}


#i_logo
{position : relative;
top : 20px;
}



.postbody {
text-align:justify;
}

Lumélys
***

Féminin
Messages : 131
Inscrit(e) le : 13/08/2009

http://dimensionsarts.forum-canada.com/
Lumélys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Milouze14 le Mar 3 Jan 2012 - 7:35

Salut Lumélys,
heu désolé mais je ne comprend pas ta question Embarassed .

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Lumélys le Mar 3 Jan 2012 - 21:06

C'est simple:
Que dois-je modifier dans mon CSS pour avoir ce que je désire sans que mes codes ne disparaisse? (Je parle là sur mon site que les catégories bougent.)
Voici le site: http://www.leschevaliersdemeraude100ans.com/forum
Vous voyez que les noms de catégorie sont codés. Je voudrais que si je remplace quelque chose cela ne change pas les codes

Lumélys
***

Féminin
Messages : 131
Inscrit(e) le : 13/08/2009

http://dimensionsarts.forum-canada.com/
Lumélys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Invité le Mar 3 Jan 2012 - 21:21

Bonsoir,

Il ne faut pas toucher aux codes CSS déjà présents dans votre feuille CSS. Ajoutez simplement ceux que vous a donnés Milouze14 tout en bas, puis validez.

Cordialement.

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Lumélys le Mer 4 Jan 2012 - 3:16

Bonsoir, malheureusement rien n'apparaît :/
Il m'a dit de supprimer la classe contour mais j'ignore où elle est dans mon CSS.

Lumélys
***

Féminin
Messages : 131
Inscrit(e) le : 13/08/2009

http://dimensionsarts.forum-canada.com/
Lumélys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Milouze14 le Mer 4 Jan 2012 - 7:22

@Lumélys a écrit:Bonsoir, malheureusement rien n'apparaît :/
Il m'a dit de supprimer la classe contour mais j'ignore où elle est dans mon CSS.

Salut Lumélys,
tu as ta propre feuille de style
Dans ta feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Afin que tu comprennes mieux voici une image Wink .


peux tu donner le contenu ici stp


a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Lumélys le Jeu 5 Jan 2012 - 0:38

Coucou,
ayant regardé un peu plus haut, elle y était ^^
Code:
a:link,a:active,a:visited {
        text-decoration: none;
    }
 
body {
background-repeat: no-repeat;
background-position: top center;
background-image: ("http://nsa21.casimages.com/img/2010/09/26/100926031218244814.png")
}body
 
td.row1{
background-image: url("http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png");
}
td.row2{
background-image: url("http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png");
}
td.row3{
background-image: url("http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png");
}
td.row3Right{background-image : url(http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png);}
 
.forumline{
    border: 1px #4f6b6a solid;
    }
a.forumlink {
font-weight: lighter !important;
text-decoration: none;
font-variant:small-caps;
border-bottom: 1px #648786 solid;
  text-align: center;
}
 
a.forumlink:hover {
text-decoration: none;
font-variant:small-caps;
  text-align: center;
}
.nav{
    font-size: 12px;
font-weight: lighter !important;
text-decoration: none;
    }
a.nav{
font-weight: lighter !important;
text-decoration: none;
    }
a.nav:hover{
text-decoration: none;
    }
.topictitle,h1,h2{
    font-weight: lighter !important;
    }
h2.topic-title {
  display: inline;
    margin: 6;
    padding: 6;
  }
.secondarytitle,.secondarytitle h2 {
    font-weight: lighter !important;
  }
.cattitle{
    font-weight: lighter !important;
  text-align: center;
}
 
 
 
 
a.forumlink
{
display: block;
padding-left: 10px;
font-size: 14px;
font-family: Kalinga;
letter-spacing: 3px;
border-bottom: 3px solid #000000;
border-left: 3px solid #000000;
border-radius: 15px;
-moz-border-radius: 15px;
-htm-border-radius: 15px;
-webkit-border-radius: 15px;
-o-border-radius: 15px;
color: #FFFFFF !important;
text-shadow: 2px 1px 4px #e6dddd;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
a.forumlink:hover
{
padding-left: 30px;
text-transform: uppercase;
border-bottom: 4px solid #c6addb;
border-left: 4px solid #c6addb;
color: #FFFFFF !important;
text-shadow: 2px 2px 3px #000000;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
.forumline
{
width: 95%;
margin: auto;
background-color: #000000;
border-top: 2px solid #000000;
border-bottom: 2px solid #000000;
padding: 2px;
}
#cate_foot
{
width: 900px;
height: 1000px;
margin: auto;
background: url(http://img11.hostingpics.net/pics/139213category04.jpg) center no-repeat;
}
 
 
#i_logo
{position : relative;
top : 20px;
}
 
 
 
.postbody {
text-align:justify;
}

Lumélys
***

Féminin
Messages : 131
Inscrit(e) le : 13/08/2009

http://dimensionsarts.forum-canada.com/
Lumélys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Milouze14 le Jeu 5 Jan 2012 - 6:40

Salut Lumélys,

tu peux ajouter sans problème la class de ce topic:
http://forum.forumactif.com/t321619-sous-forum-en-code-encadre#2789675

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Lumélys le Ven 6 Jan 2012 - 3:46

Coucou
c'est déjà fait en bas du CSS mais rien n'apparaît Wink

Lumélys
***

Féminin
Messages : 131
Inscrit(e) le : 13/08/2009

http://dimensionsarts.forum-canada.com/
Lumélys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Milouze14 le Ven 6 Jan 2012 - 7:36

Salut Lumélys,
si tu ajouté dans la description du forum le code
mentionné plus haut:

Code:
<div class="contour">Ton texte</div>


A placer avant le texte:
Code:
<div class="contour">
A placer après ton texte:
Code:
</div>


Il faut tout lire mon amie Wink .

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Lumélys le Sam 7 Jan 2012 - 1:06

Oui mais si tu portes attention à tout ce qui est mentionné, j'ignore où ce trouve la classe je-sais-pas-quoi dans mon CSS. c'est ca que j'avais demandé. Où fallait que je remplace quoi pour le code?
Et puis ce n'est pas un carré que je veux mais un genre d'ombrage.
Que dois-je faire au juste? Mettre ce code et ensuite tes codes pour mon ombrage?

Lumélys
***

Féminin
Messages : 131
Inscrit(e) le : 13/08/2009

http://dimensionsarts.forum-canada.com/
Lumélys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Milouze14 le Sam 7 Jan 2012 - 8:42

Salut,
bon si je ne fie au lien de ton forum et à la première description
supprime le contenu et remplace par ceci:
Code:
<div class="contour">

Vous êtes obligés de les lire car dans ces parchemins, il y a les règles du forum, l'histoire du forum, la signature du forum et autres choses. Veuillez les respecter et bien sûr signer les règlements.

</div>

Puis dans ta feuille de style supprimes la totalité et remplace par celle-ci:
J'ai ajouté la class à ta css Wink

Spoiler:
Code:
.contour
        {
          border:2px solid #F08080;
          margin-left:2%;
          margin-right:2%;
          padding:4px;
  opacity : 0.5;
    -moz-opacity : 0.5;
    -ms-filter: "alpha(opacity=50)"; /* IE 8 */
    filter : alpha(opacity=50); /* IE < 8 */
        }



a:link,a:active,a:visited {
                text-decoration: none;
            }
       
body {
        background-repeat: no-repeat;
        background-position: top center;
        background-image: ("http://nsa21.casimages.com/img/2010/09/26/100926031218244814.png")
        }

       
td.row1{
        background-image: url("http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png");
        }
 td.row2{
        background-image: url("http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png");
        }
td.row3{
        background-image: url("http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png");
        }
td.row3Right{background-image : url(http://nsa21.casimages.com/img/2010/09/26/100926120502705171.png);}
       
.forumline{
            border: 1px #4f6b6a solid;
            }
a.forumlink {
        font-weight: lighter !important;
        text-decoration: none;
        font-variant:small-caps;
        border-bottom: 1px #648786 solid;
          text-align: center;
        }
       
a.forumlink:hover {
        text-decoration: none;
        font-variant:small-caps;
          text-align: center;
        }
.nav{
            font-size: 12px;
        font-weight: lighter !important;
        text-decoration: none;
            }
 a.nav{
        font-weight: lighter !important;
        text-decoration: none;
            }
a.nav:hover{
        text-decoration: none;
            }
.topictitle,h1,h2{
            font-weight: lighter !important;
            }
h2.topic-title {
          display: inline;
            margin: 6;
            padding: 6;
          }
.secondarytitle,.secondarytitle h2 {
            font-weight: lighter !important;
          }
.cattitle{
            font-weight: lighter !important;
          text-align: center;
        }
 
 a.forumlink
        {
        display: block;
        padding-left: 10px;
        font-size: 14px;
        font-family: Kalinga;
        letter-spacing: 3px;
        border-bottom: 3px solid #000000;
        border-left: 3px solid #000000;
        border-radius: 15px;
        -moz-border-radius: 15px;
        -htm-border-radius: 15px;
        -webkit-border-radius: 15px;
        -o-border-radius: 15px;
        color: #FFFFFF !important;
        text-shadow: 2px 1px 4px #e6dddd;
        transform: all;
        -moz-transform: all;
        -o-transform: all;
        -htm-transform: all;
        -webkit-transform: all;
        transition: 1s;
        -moz-transition: 1s;
        -o-transition: 1s;
        -htm-transition: 1s;
        -webkit-transition: 1s;
        }
a.forumlink:hover
        {
        padding-left: 30px;
        text-transform: uppercase;
        border-bottom: 4px solid #c6addb;
        border-left: 4px solid #c6addb;
        color: #FFFFFF !important;
        text-shadow: 2px 2px 3px #000000;
        transform: all;
        -moz-transform: all;
        -o-transform: all;
        -htm-transform: all;
        -webkit-transform: all;
        transition: 1s;
        -moz-transition: 1s;
        -o-transition: 1s;
        -htm-transition: 1s;
        -webkit-transition: 1s;
        }
 .forumline
        {
        width: 95%;
        margin: auto;
        background-color: #000000;
        border-top: 2px solid #000000;
        border-bottom: 2px solid #000000;
        padding: 2px;
        }
#cate_foot
        {
        width: 900px;
        height: 1000px;
        margin: auto;
        background: url(http://img11.hostingpics.net/pics/139213category04.jpg) center no-repeat;
        }
#i_logo
        {position : relative;
        top : 20px;
        }
 .postbody {
        text-align:justify;
        }

De ce fait, avec la class ( .contour) tu auras l'ombrage que tu désires
à toi de modifier la couleur etc.
a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Lumélys le Dim 8 Jan 2012 - 2:13

Coucou,
Ca fonctionne mais comment puis-je avoir le contour de forme ovale et pas carré? (je parle que les coins sont arrondies donc)
Merci ^^

Lumélys
***

Féminin
Messages : 131
Inscrit(e) le : 13/08/2009

http://dimensionsarts.forum-canada.com/
Lumélys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Milouze14 le Dim 8 Jan 2012 - 7:11

Salut,
supprimes la class contour de ta feuille de style et remplace
par:
Code:
.contour
{
border:2px solid #F08080;
margin-left:2%;
margin-right:2%;
padding:4px;
opacity : 0.5;
-moz-opacity : 0.5;
-ms-filter: "alpha(opacity=50)"; /* IE 8 */
filter : alpha(opacity=50); /* IE < 8 */
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}



a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Sous-forum en code (encadré?)

Message par Invité le Lun 16 Jan 2012 - 6:06

Bonjour,

Afin de faciliter la gestion des problèmes, si votre problème est résolu, pensez à :
  • éditer votre premier message,
  • cocher l'icône résolu
  • Et enregistrer en cliquant sur


Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton

A bientôt sur ForumActif Smile

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum