Problème avec le codage de ma PA

2 participants

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

Résolu Problème avec le codage de ma PA

Message par ChiNoAmePower Sam 29 Mar 2014 - 0:22

Bonjour
J'ai un souci avec la page d'accueil de mon forum:

Spoiler:

Ont peut clairement voir que les images du staff sont décalées par rapport à leurs cadres. Ça ne semble peut-être pas grand chose mais cela me perturbe beaucoup °^°

Voici mon code CSS:
Code:
/* PA (C) SUNHAE */
.nomfow{
  font-size: 16px;
  text-align: center;
  color: #5EB6DD;
  text-shadow: 1px 1px 0px #C4FCCA;
  text-transform:uppercase;
  letter-spacing: -2px;
}

.lienutil{
  text-align: center;
  color: #8CC6D7!important;
  text-shadow: 1px 1px 0px #C4FCCA;
  text-transform:uppercase;
}

.titrep{
  display: block;
  text-align: center;
  width: auto;
  height: 15px;
  background-color: #8CC6D7;
  color: #E5F7F5;
  text-transform:uppercase;
  text-shadow: 1px 1px 0px #C4D7ED;
}

.bloc1{
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: 150px;
  height: 120px;
  background-color: #E5F7F5;
  overflow: auto;
}

.bloc2{
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: 300px;
  height: 120px;
  background-color: #E5F7F5;
  overflow: hidden;
}

.bloc2texte{
  width: 295px;
  height: 105px;
  overflow: auto;
  padding: 3px;
}

.bloc2 img{
  margin-top: -111px;
  transition: transform 2s;
  -moz-transition: -moz-transform 3s;
  -o-transition: -o-transform 3s;
  -webkit-transition: -webkit-transform 3s;
}

.bloc2:hover img{
  transform: translateX(+338px);
  -moz-transform: translateX(+338px);
  -o-transform: translateX(+338px);
  -webkit-transform: translateX(+338px);
}

.bloc3{
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: 220px;
  height: 120px;
  background-color: #E5F7F5;
  overflow: auto;
}

.bloc4{
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: 300px;
  height: 120px;
  background-color: #E5F7F5;
  overflow: auto;
}

.bloc4 img{
  margin: 3px;
}

.staff{
  margin: 3px;
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 125px;
  -moz-border-radius: 125px;
  border-radius: 125px;
  width: 60px;
  height: 60px;
  text-align: center;
  background-color: #E5F7F5;
  overflow: hidden;
}

.staff img{
  -webkit-border-radius: 125px;
  -moz-border-radius: 125px;
  border-radius: 125px;
  margin-top: -12px;
  transition: transform 1s;
  -moz-transition: -moz-transform 2s;
  -o-transition: -o-transform 2s;
  -webkit-transition: -webkit-transform 2s;
}

.staff:hover img{
  -webkit-border-radius: 125px;
  -moz-border-radius: 125px;
  border-radius: 125px;
  transform: translateX(+98px);
  -moz-transform: translateX(+98px);
  -o-transform: translateX(+98px);
  -webkit-transform: translateX(+98px);
}
/* FIN */

Et mon code html:
Code:
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css" />
<table cellspacing="10">
   
   <tbody>
      
      <tr>
         
         <td colspan="3">
            
            <div class="nomfow">
                Naruto's successors
            </div>
            
            <div class="lienutil">
                <a href="http://naruto-s-successors.forumactif.org/t3-le-reglement#4">Règlement</a> - <a href="http://naruto-s-successors.forumactif.org/t5-contexte#7">Contexte</a> - <a href="http://naruto-s-successors.forumactif.org/c19-partie-invite">Partie invité</a>
            </div>
            
         </td>
         
      </tr>
      
      <tr>
         
         <td>
            
            <div class="bloc1">
               
               <div class="titrep">
                   Crédits
               </div>
                Page d'Accueil (c) Sunhae de <a href="http://forum-theme.forumperso.com/">Libre Graph'</a>
            </div>
            
         </td>
         
         <td>
            
            <div class="bloc2">
               
               <div class="titrep">
                   Contexte
               </div>
               
               <div class="bloc2texte">
                   Vous connaissez tous Naruto ? Le célèbre manga shönen ? Et que se passerais-t-il si nous avancions d'un siècle et demi dans l'histoire ? Cela donnerais Naruto's successors ! Le forum RPG ou c'est désormais à vous de combattre la nouvelle menace ! Et pour vous aider a y voir plus clair je vais vous expliquer ce qu'il c'est passer et 150 ans : Naruto a réussi à battre Madara et, fût reconnu de tous comme étant un véritable héros. Quelques années plus tard il se voit attribuer le poste d'hokage...<a href="http://naruto-s-successors.forumactif.org/t5-contexte#7" class="postlink" target="_blank" rel="nofollow">suite ?</a> ___________________________________
               </div><img src="http://i56.servimg.com/u/f56/18/04/09/05/uchiha11.jpg" />
            </div>
            
         </td>
         
         <td>
            
            <div class="bloc3">
               
               <div class="titrep">
                   Nouveautés
               </div>
                XX.XX.XX - Nouveauté Ici.<br />XX.XX.XX - Nouveauté Ici.<br />XX.XX.XX - Nouveauté Ici.<br />XX.XX.XX - Nouveauté Ici.<br />XX.XX.XX - Nouveauté Ici.
            </div>
            
         </td>
         
      </tr>
      
   </tbody>
</table>
 
<table cellspacing="10">
   
   <tbody>
      
      <tr>
         
         <td>
            
            <div class="bloc3">
               
               <div class="titrep">
                   Staff
               </div><br />
               <table>
                  
                  <tbody>
                     
                     <tr>
                        
                        <td>
                           
                           <div class="staff">
                               Miyu<img src="http://i56.servimg.com/u/f56/18/04/09/05/staff10.jpg" />
                           </div>
                           
                        </td>
                        
                        <td>
                           
                           <div class="staff">
                               Ryukö<img src="http://i56.servimg.com/u/f56/18/04/09/05/rr10.jpg" />
                           </div>
                           
                        </td>
                        
                     </tr>
                     
                  </tbody>
                  
               </table>
               
            </div>
            
         </td>
         
         <td>
            
            <div class="bloc1">
               
               <div class="titrep">
                   Démons a queues pris
               </div>
               
               <div style="text-align: center; margin-top: 5px;">
                   -Le démon loup a 13 queues
               </div>
               
            </div>
            
         </td>
         
         <td>
            
            <div class="bloc4">
               
               <div class="titrep">
                   Partenaires et top-sites
               </div><br />Donne un petit vote pour Miyu et son forum <3 : <a href="http://www.root-top.com/topsite/topmorpg/in.php?ID=2056" class="postlink" target="_blank" rel="nofollow">Top 100 RPG</a> , <a href="http://www.root-top.com/topsite/obsession27/in.php?ID=20062" class="postlink" target="_blank" rel="nofollow">TOP 50 Rpg</a> , <a href="http://www.rpg-paradize.com/?page=vote&vote=38093" class="postlink" target="_blank" rel="nofollow">RPG Paradize</a> _______________________________________________<img src="http://img4.hostingpics.net/pics/560953logowizard.png" /><img src="http://img4.hostingpics.net/pics/335744logofowdechoco.png" /><img src="http://img4.hostingpics.net/pics/906033logonouveaumonde.png" /><img src="http://img15.hostingpics.net/pics/776058narr.png" /><-Notre logo<br />
            </div>
            
         </td>
         
      </tr>
      
   </tbody>
</table>

Ça serais gentil si vous pouvez me remettre ça comme il faut, merci infiniment ! =3


Dernière édition par ChiNoAmePower le Sam 29 Mar 2014 - 1:00, édité 1 fois
avatar

ChiNoAmePower
*

Messages : 38
Inscrit(e) le : 29/03/2014

http://madness-wonderland.forumactif.org/
ChiNoAmePower a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par Dr. Sam Sam 29 Mar 2014 - 0:26

Bonsoir,

Remplace le code te ta PA par celui-ci:
Code:
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css" />
<table cellspacing="10">
   
   <tbody>
      
      <tr>
         
         <td colspan="3">
            
            <div class="nomfow">
                Naruto's successors
            </div>
            
            <div class="lienutil">
                <a href="http://naruto-s-successors.forumactif.org/t3-le-reglement#4">Règlement</a> - <a href="http://naruto-s-successors.forumactif.org/t5-contexte#7">Contexte</a> - <a href="http://naruto-s-successors.forumactif.org/c19-partie-invite">Partie invité</a>
            </div>
            
         </td>
         
      </tr>
      
      <tr>
         
         <td>
            
            <div class="bloc1">
               
               <div class="titrep">
                   Crédits
               </div>
                Page d'Accueil (c) Sunhae de <a href="http://forum-theme.forumperso.com/">Libre Graph'</a>
            </div>
            
         </td>
         
         <td>
            
            <div class="bloc2">
               
               <div class="titrep">
                   Contexte
               </div>
               
               <div class="bloc2texte">
                   Vous connaissez tous Naruto ? Le célèbre manga shönen ? Et que se passerais-t-il si nous avancions d'un siècle et demi dans l'histoire ? Cela donnerais Naruto's successors ! Le forum RPG ou c'est désormais à vous de combattre la nouvelle menace ! Et pour vous aider a y voir plus clair je vais vous expliquer ce qu'il c'est passer et 150 ans : Naruto a réussi à battre Madara et, fût reconnu de tous comme étant un véritable héros. Quelques années plus tard il se voit attribuer le poste d'hokage...<a href="http://naruto-s-successors.forumactif.org/t5-contexte#7" class="postlink" target="_blank" rel="nofollow">suite ?</a> ___________________________________
               </div><img src="http://i56.servimg.com/u/f56/18/04/09/05/uchiha11.jpg" />
            </div>
            
         </td>
         
         <td>
            
            <div class="bloc3">
               
               <div class="titrep">
                   Nouveautés
               </div>
                XX.XX.XX - Nouveauté Ici.<br />XX.XX.XX - Nouveauté Ici.<br />XX.XX.XX - Nouveauté Ici.<br />XX.XX.XX - Nouveauté Ici.<br />XX.XX.XX - Nouveauté Ici.
            </div>
            
         </td>
         
      </tr>
      
   </tbody>
</table>
 
<table cellspacing="10">
   
   <tbody>
      
      <tr>
         
         <td>
            
            <div class="bloc3">
               
               <div class="titrep">
                   Staff
               </div><br />
               <table align="center">
                  
                  <tbody>
                     
                     <tr>
                        
                        <td>
                           
                           <div class="staff">
                               Miyu<img src="http://i56.servimg.com/u/f56/18/04/09/05/staff10.jpg" />
                           </div>
                           
                        </td>
                        
                        <td>
                           
                           <div class="staff">
                               Ryukö<img src="http://i56.servimg.com/u/f56/18/04/09/05/rr10.jpg" />
                           </div>
                           
                        </td>
                        
                     </tr>
                     
                  </tbody>
                  
               </table>
               
            </div>
            
         </td>
         
         <td>
            
            <div class="bloc1">
               
               <div class="titrep">
                   Démons a queues pris
               </div>
               
               <div style="text-align: center; margin-top: 5px;">
                   -Le démon loup a 13 queues
               </div>
               
            </div>
            
         </td>
         
         <td>
            
            <div class="bloc4">
               
               <div class="titrep">
                   Partenaires et top-sites
               </div><br />Donne un petit vote pour Miyu et son forum <3 : <a href="http://www.root-top.com/topsite/topmorpg/in.php?ID=2056" class="postlink" target="_blank" rel="nofollow">Top 100 RPG</a> , <a href="http://www.root-top.com/topsite/obsession27/in.php?ID=20062" class="postlink" target="_blank" rel="nofollow">TOP 50 Rpg</a> , <a href="http://www.rpg-paradize.com/?page=vote&vote=38093" class="postlink" target="_blank" rel="nofollow">RPG Paradize</a> _______________________________________________<img src="http://img4.hostingpics.net/pics/560953logowizard.png" /><img src="http://img4.hostingpics.net/pics/335744logofowdechoco.png" /><img src="http://img4.hostingpics.net/pics/906033logonouveaumonde.png" /><img src="http://img15.hostingpics.net/pics/776058narr.png" /><-Notre logo<br />
            </div>
            
         </td>
         
      </tr>
      
   </tbody>
</table>


Cordialement,
Smile
Dr. Sam

Dr. Sam
*****

Masculin
Messages : 894
Inscrit(e) le : 28/06/2012

http://www.fa-aide.com/
Dr. Sam a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par ChiNoAmePower Sam 29 Mar 2014 - 0:30

Désolé mais mon ordi ne semble pas être d'accord avec vous... Je ne vois aucune différence... °^°
avatar

ChiNoAmePower
*

Messages : 38
Inscrit(e) le : 29/03/2014

http://madness-wonderland.forumactif.org/
ChiNoAmePower a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par Dr. Sam Sam 29 Mar 2014 - 0:34

Bonsoir,

Vidé le cache de votre navigateur car de mon coté, je n'ai pas fait d'erreur, http://phpbb2.1forumgratuit.com/ ...

Je suis sur votre forum et de mon coté tout est correcte:
Problème avec le codage de ma PA Couleu10

Cordialement,
Smile
Dr. Sam

Dr. Sam
*****

Masculin
Messages : 894
Inscrit(e) le : 28/06/2012

http://www.fa-aide.com/
Dr. Sam a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par ChiNoAmePower Sam 29 Mar 2014 - 0:49

Bah je suis vraiment désolé mais j'ai baux vider le cache et essayer sur mon autre ordinateur je vois que le problème est toujours là... =/

Vilains n'ordis ! °^°
avatar

ChiNoAmePower
*

Messages : 38
Inscrit(e) le : 29/03/2014

http://madness-wonderland.forumactif.org/
ChiNoAmePower a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par Dr. Sam Sam 29 Mar 2014 - 0:51

Actualiser votre page en faisant CTRL + F5.

Si cela ne fonctionne pas, quel navigateur utilisez vous ?

UNE MINUTE!... Quand vous dites que c'était décalé, vous parliez que ceci n'étais pas centrer, ou l'image du staff ne prenait pas le cercle au complet ?


Cordialement,
Smile


Dernière édition par Dr. Sam le Sam 29 Mar 2014 - 0:53, édité 1 fois
Dr. Sam

Dr. Sam
*****

Masculin
Messages : 894
Inscrit(e) le : 28/06/2012

http://www.fa-aide.com/
Dr. Sam a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par ChiNoAmePower Sam 29 Mar 2014 - 0:52

J'utilise Google Chrome
avatar

ChiNoAmePower
*

Messages : 38
Inscrit(e) le : 29/03/2014

http://madness-wonderland.forumactif.org/
ChiNoAmePower a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par Dr. Sam Sam 29 Mar 2014 - 0:53

Dr. Sam a écrit:

EDIT: UNE MINUTE!... Quand vous dites que c'était décalé, vous parliez que ceci n'étais pas centrer, ou l'image du staff ne prenait pas le cercle au complet ?


Cordialement,
Smile
Dr. Sam

Dr. Sam
*****

Masculin
Messages : 894
Inscrit(e) le : 28/06/2012

http://www.fa-aide.com/
Dr. Sam a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par ChiNoAmePower Sam 29 Mar 2014 - 0:55

Oui c'était bien de se problème dont je parlais
avatar

ChiNoAmePower
*

Messages : 38
Inscrit(e) le : 29/03/2014

http://madness-wonderland.forumactif.org/
ChiNoAmePower a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par Dr. Sam Sam 29 Mar 2014 - 0:56

Ah!

Désolé, ceci est mon erreur.

Changez votre CSS par celui-ci:
Code:
/* PA (C) SUNHAE */
.nomfow{
  font-size: 16px;
  text-align: center;
  color: #5EB6DD;
  text-shadow: 1px 1px 0px #C4FCCA;
  text-transform:uppercase;
  letter-spacing: -2px;
}
 
.lienutil{
  text-align: center;
  color: #8CC6D7!important;
  text-shadow: 1px 1px 0px #C4FCCA;
  text-transform:uppercase;
}
 
.titrep{
  display: block;
  text-align: center;
  width: auto;
  height: 15px;
  background-color: #8CC6D7;
  color: #E5F7F5;
  text-transform:uppercase;
  text-shadow: 1px 1px 0px #C4D7ED;
}
 
.bloc1{
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: 150px;
  height: 120px;
  background-color: #E5F7F5;
  overflow: auto;
}
 
.bloc2{
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: 300px;
  height: 120px;
  background-color: #E5F7F5;
  overflow: hidden;
}
 
.bloc2texte{
  width: 295px;
  height: 105px;
  overflow: auto;
  padding: 3px;
}
 
.bloc2 img{
  margin-top: -111px;
  transition: transform 2s;
  -moz-transition: -moz-transform 3s;
  -o-transition: -o-transform 3s;
  -webkit-transition: -webkit-transform 3s;
}
 
.bloc2:hover img{
  transform: translateX(+338px);
  -moz-transform: translateX(+338px);
  -o-transform: translateX(+338px);
  -webkit-transform: translateX(+338px);
}
 
.bloc3{
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: 220px;
  height: 120px;
  background-color: #E5F7F5;
  overflow: auto;
}
 
.bloc4{
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: 300px;
  height: 120px;
  background-color: #E5F7F5;
  overflow: auto;
}
 
.bloc4 img{
  margin: 3px;
}
 
.staff{
  margin: 3px;
  border: 1px solid #8CC6D7;
  -webkit-border-radius: 125px;
  -moz-border-radius: 125px;
  border-radius: 125px;
  width: 60px;
  height: 60px;
  text-align: center;
  background-color: #E5F7F5;
  overflow: hidden;
}
 
.staff img{
  -webkit-border-radius: 125px;
  -moz-border-radius: 125px;
  border-radius: 125px;
  margin-top: -15px;
  transition: transform 1s;
  -moz-transition: -moz-transform 2s;
  -o-transition: -o-transform 2s;
  -webkit-transition: -webkit-transform 2s;
}
 
.staff:hover img{
  -webkit-border-radius: 125px;
  -moz-border-radius: 125px;
  border-radius: 125px;
  transform: translateX(+98px);
  -moz-transform: translateX(+98px);
  -o-transform: translateX(+98px);
  -webkit-transform: translateX(+98px);
}
/* FIN */


Cordialement,
Smile
Dr. Sam

Dr. Sam
*****

Masculin
Messages : 894
Inscrit(e) le : 28/06/2012

http://www.fa-aide.com/
Dr. Sam a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec le codage de ma PA

Message par ChiNoAmePower Sam 29 Mar 2014 - 0:59

Ça ne fait rien ! Merci beaucoup ! Le problème est résolut ! Chi' vous aime ! =3
avatar

ChiNoAmePower
*

Messages : 38
Inscrit(e) le : 29/03/2014

http://madness-wonderland.forumactif.org/
ChiNoAmePower a été remercié(e) par l'auteur de ce sujet.

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

- Sujets similaires

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