Problème de code pour un cadre entrecoupé d'écriture dans un topic.

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

Résolu Problème de code pour un cadre entrecoupé d'écriture dans un topic.

Message par Mohnn le Mar 14 Jan 2014 - 18:02

Bonjour bonjour,

Je viens vous voir car je suis actuellement en train de coder un topic contenant le trombinoscope racial de mon forum (nous avons un forum rpg fantastique entre autre). Donc j'ai un 'plan' de rendu  que voici :

Je n'ai pas terminé de le coder toute fois je rencontre un soucis pour l'encadrement d'une classe. Vous avez dans un 'cadre' trois races : Humains, Illusionnistes et Sorciers. Au dessus vous avez le nom de la classe : Humanoïdes. Ce qui me pose problème c'est qu'il faudrait que le nom de la classe coupe le cadre.

Exemple que nous avons réalisé avec les catégories du forum :


Voici mon code dans le css :

Code:
/* trombinoscope */
.cssactif_trombinoscope {
height: auto ;
border: 1px ;
background-color: #DEE3E7 ;
margin: 5% ;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
border-radius: 20px ;
cellspacing: 20px ;
padding : 5%;
-webkit-box-shadow: 0px 0px 10px 0px #000000 ;
-moz-box-shadow: 0px 0px 10px 0px #000000 ;
box-shadow: 0px 0px 10px 0px #000000 ;
text-align: justify;
font: Verdana, Arial, Helvetica, sans-serif;
font-color: #1a293b;
}
.cssactif_trombinoscope_titre {
position: relative;
font-family: Parisienne;
top: -55px;
text-align: center;
padding-right: 20px;  
color:#000000;
font-size: 45px;
  }
.cssactif_trombinoscope ab {
  text-align: right;
}
.cssactif_trombinoscope_race {
height: auto ;
border: 1px solid #000000 ;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
border-radius: 20px ;
cellspacing: 20px ;
padding : 5%;
text-align: justify;
font: Verdana, Arial, Helvetica, sans-serif;
}
.cssactif_trombinoscope_race_titre {
position: relative;
top: -49px;
text-align: left;
color:#000000;
font-size: 30px;
}
/* FIN trombinoscope */

Mon code dans le topic du trombi :

Code:
<div class="cssactif_trombinoscope"><div class="cssactif_trombinoscope_titre">TROMBINOSCOPE RACIAL</div>

Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla

<div class="cssactif_trombinoscope_race"><div class="cssactif_trombinoscope_race_titre">Les humanoïdes :</div>
Les humanoïdes sont une race mortelle dont la forme de vie principale est humaine c’est à dire qu’en les croisant dans la rue, ils vous apparaissent normaux et sans pouvoirs particuliers (exception pour certains humas aux oreilles et queues apparentes par exemple).

<ab>Les humains :</ab>
Les humains sont des êtres vivants etc...

<ab>Les sorciers :</ab>
Se sont des êtres humains etc... </div>

</div>

Merci d'avance.

Mohnn.


Dernière édition par Mohnn le Mar 14 Jan 2014 - 22:54, édité 1 fois

Mohnn
***

Féminin
Messages : 105
Inscrit(e) le : 21/05/2011

http://otsu.forumactif.com/forum
Mohnn a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de code pour un cadre entrecoupé d'écriture dans un topic.

Message par Scoubifitz le Mar 14 Jan 2014 - 19:06

bonsoir,

rajout d'un "span" pour le titre des races
mise en conformité des balises "ab" qui n'existent pas , par des balises "h4"

Code:
<div class="cssactif_trombinoscope"><div class="cssactif_trombinoscope_titre">TROMBINOSCOPE RACIAL</div>

Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla

<div class="cssactif_trombinoscope_race"><div class="cssactif_trombinoscope_race_titre"><span>Les humanoïdes :</span></div>
Les humanoïdes sont une race mortelle dont la forme de vie principale est humaine c’est à dire qu’en les croisant dans la rue, ils vous apparaissent normaux et sans pouvoirs particuliers (exception pour certains humas aux oreilles et queues apparentes par exemple).

<h4>Les humains :</h4>
Les humains sont des êtres vivants etc...

<h4>Les sorciers :</h4>
Se sont des êtres humains etc... </div>

</div>

Modification du CSS :

Code:
/*DEBUT trombinoscope */

.cssactif_trombinoscope {
border: 1px ;
background-color: #DEE3E7 ;
margin: 5% ;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
border-radius: 20px ;
padding : 20px;
-webkit-box-shadow: 0px 0px 10px 0px #000000 ;
-moz-box-shadow: 0px 0px 10px 0px #000000 ;
box-shadow: 0px 0px 10px 0px #000000 ;
text-align: justify;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #1a293b;
}
.cssactif_trombinoscope_titre {
font-family: Parisienne;
margin-top: -50px;
text-align: center;
color:#000000;
font-size: 45px;
}
.cssactif_trombinoscope h4 {
text-align: right;
font-size: 20px;
}
.cssactif_trombinoscope_race {
border: 1px solid #000000 ;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
border-radius: 20px ;
padding : 10px;
margin-top : 25px;
text-align: justify;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.cssactif_trombinoscope_race_titre {
margin-top: -30px;
text-align: left;
}
.cssactif_trombinoscope_race_titre span{
background-color: #DEE3E7 ;
padding :0 10px;
color:#000000;
font-size: 30px;
}
/* FIN trombinoscope */

Scoubifitz
+ Hyperactif +

Masculin
Messages : 3539
Inscrit(e) le : 18/03/2008

http://scoubidous.superforum.fr/
Scoubifitz a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de code pour un cadre entrecoupé d'écriture dans un topic.

Message par Mohnn le Mar 14 Jan 2014 - 22:53

Merci beaucoup ! C'est parfait ^^.

Mohnn
***

Féminin
Messages : 105
Inscrit(e) le : 21/05/2011

http://otsu.forumactif.com/forum
Mohnn 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