Problème avec le codage de ma PA

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 le 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

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 le 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
*****

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 le 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... °^°

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 le 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:


Cordialement,
Smile

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 le 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 ! °^°

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 le 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
*****

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 le Sam 29 Mar 2014 - 0:52

J'utilise Google Chrome

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 le 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
*****

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 le Sam 29 Mar 2014 - 0:55

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

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 le 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
*****

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 le Sam 29 Mar 2014 - 0:59

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

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


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