Sujets similaires

Sujet: Re: Mise en forme d'une PA Dim 21 Nov 2010, 08:49

Il faut aussi savoir que vous n'avez pas la même résolution d'ecran, ça joue beaucoup sur ça aussi.

Sujet: Re: Mise en forme d'une PA Dim 21 Nov 2010, 08:51

Bah , je possede un 23" mais lorsque je code quelque chose , je met toujours un

margin:0 auto pour que ce soit pareil sur toutes les résolutions .

Sujet: Re: Mise en forme d'une PA Dim 21 Nov 2010, 09:01

Moi c'est un 17" il me semble

Sujet: Re: Mise en forme d'une PA Dim 21 Nov 2010, 09:04

Ouai mais ça ne donne pas le même rendu, peux-tu me passer une capture d'écran ici'?

Sujet: Re: Mise en forme d'une PA Dim 21 Nov 2010, 09:12

Si c'est à moi que tu demandes j'en ai mis une juste au dessus celle de Hiro'

Sujet: Re: Mise en forme d'une PA Dim 21 Nov 2010, 11:31

C'est le fond qui bug?

Sujet: Re: Mise en forme d'une PA Dim 21 Nov 2010, 11:41

Non c'est tout il me semble, parce que les encadrés sont décalés aussi

Sujet: Re: Mise en forme d'une PA Mer 24 Nov 2010, 14:31

Je ne sais pas quoi dire... ._."

Sujet: Re: Mise en forme d'une PA Jeu 25 Nov 2010, 16:07

:s j'espère que quelqu'un d'autre pourra me venir en aide

Bonjour,

Votre problème est-il toujours d'actualité ? Si tel n'est pas le cas, merci de bien vouloir cocher l'icône "Résolu" en éditant votre premier poste.

Merci Smile

Non il n'est toujours pas résolu :s

Bonjour,

Votre problème est-il toujours d'actualité ? Si tel n'est pas ne cas, merci de bien vouloir éditer votre premier message et cocher l'icône "résolu". Merci. Smile

Oui il l'est toujours

Il y a beaucoup de codes qui sont donnés dans ce sujet, je veux bien jeter un oeil, mais il me faut savoir quel est le code à modifier et quel est le problème EXACTEMENT '_'

Moi de même n_n
Peux-tu récapituler précisément l'état actuel de ton problème =D ?

Sa nous aidera =)

Alors déjà merci d'avoir répondu =)

Pour l'état actuel de la PA c'est ça : http://america-paradise.forumactif.com/

tout est détraqué enfête même les petits cadres bref je pense pas qu'il y ai trop à expliquer juste à regarder ce qui est.

J'espère que vous pourrez m'aider

Le codage est pour le moins... original. Mais pourquoi pas ¬_¬

Récapitulons, le code de ce message d'accueil, débarrassé de ses lourdeurs, est ceci :

Code:: <div align="center">
<table class="m-a_perso" width="875" height="500" border="0" cellspacing="5" cellpadding="0">
   <tr>
      <td colspan="3" align="center">
         <div class="m-a_grandtitre">Bienvenue {USERNAME}</div>
      </td>
   </tr>
   <tr>
      <td width="25%">
         <div style="text-align: left;">
            <strong>News :</strong>
            <br /><br />
            <strong>Ouverture du forum :</strong> xx/xx/xx
            <br />
            <div class="navigateur">Forum optimisé pour Mozilla Firefox</div>
         </div>
      </td>

      <td rowspan="2">
         <div class="msg-border">
            <div class="msg-title">Contexte</div>
            <marquee behavior="scroll" align="center" direction="up" scrollamount="1" scrolldelay="1" onmouseover='this.stop()' onmouseout='this.start()'>
               <div style="text-align: justify;padding:5px;">Vous n'êtes pas dans n'importe quelle ville, vous êtes dans "The" ville, la ville la plus belle de toute située au cœur de Miami, et pourtant ici tout n'est pas rose comme on pourrait le croire à première vue, elle ai la ville où prennent leurs vacances toute les stars ou presque. Ici règne une très bonne ambiance, les voisins s'entraident lorsqu'ils en ont besoin, s'invitent mutuellement, bref une ville avec un vrai cœur. Bien sur il existe, comme partout, quelques exceptions, des personnes rejetées, par choix ou par obligation, et pourtant elles sont loin d'être malheureuse. <br />
               Vous allez me dire, "Et alors ? Qu'es-ce qu'elle a cette ville ?" Et bien malgré cette facette très envieuse ce cache une énigme. Les étés sont chaud et les hivers très doux, vous pourrez même vous baigner dans les lacs ou la mer à cette époque, pourtant le temps peut très vite changer. De grosses tempêtes peuvent faire l'apparition en moins de deux heures, même si des personnes ont déjà été blessés ou en sont même morts les bâtiments là depuis des milliers d'années reste toujours intact, pourquoi ? Des chercheurs ont déjà fais des expériences, des tests, bref plein de choses pour élucider l'histoire mais rien n'y fait.<br /></div>
               <div align="center">
                  <a href="http://america-paradise.forumactif.com/contexte-f1/contexte-t1.htm" class="postlink">Lire la suite ici</a>
               </div>
            </marquee>
         </div>
      </td>

      <td width="25%">
            <div class="msg-border m-a_navigation">
               <div class="msg-title">Navigation</div>
               <a class="liensnavig" href="http://america-paradise.forumactif.com/reglement-f3/reglement-t2.htm">Règlement</a><br />
               <a class="liensnavig" href="http://america-paradise.forumactif.com/contexte-f1/contexte-t1.htm">Contexte</a><br />
               <a class="liensnavig" href="http://america-paradise.forumactif.com/presentations-f4/modele-a-respecter-t3.htm#3">Formulaire de Présentation</a><br />
               <a class="liensnavig" href="http://america-paradise.forumactif.com/partie-invites-f6/">Partie invités</a><br />
               <a class="liensnavig" href="ADRESSE URL DES PARTENAIRES">Partenaires</a>
            </div>
      </td>
   </tr>
   <tr>
      <td valign="top" class="msg-border" align="center">
         <div class="msg-title">Top-Partenaires</div>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
         <a href="http://america-paradise.forumactif.com"><img src="http://www.imagehotel.net/images/eq3vuqnpyu.png" border="0" /></a>
      </td>

      <td width="25%" valign="top" class="msg-border" align="center">
         <div class="msg-title">Staff</div>
         <table border="0" cellpadding="5px">
            <tr>
               <td>
                  <div class="infobullepa">
                     <img src="http://www.imagehotel.net/images/bn2jv1x49s.jpg" />
                     <span style="text-align: center;">
                        <br />
                        <img src="http://obsession27.free.fr/boutons/iconvanessahudgensol44.jpg" />
                        <font size="3">Eléna Stewart</font>
                        <a href="URL DE L'ADRESSE">> Voir son profil <</a><br />
                        <a href="URL DE L'ADRESSE">> Qui est-elle ? <</a><br />
                     </span>
                  </div>
               </td>
               <td>
               <td>
                  <div class="infobullepa">
                     <img src="http://www.imagehotel.net/images/bn2jv1x49s.jpg" />
                     <span style="text-align: center;">
                        <br />
                        <img src="http://obsession27.free.fr/boutons/iconvanessahudgensol44.jpg" />
                        <font size="3">Eléna Stewart</font>
                        <a href="URL DE L'ADRESSE">> Voir son profil <</a><br />
                        <a href="URL DE L'ADRESSE">> Qui est-elle ? <</a><br />
                     </span>
                  </div>
               </td>
               <td>
                  <div class="infobullepa">
                     <img src="http://www.imagehotel.net/images/bn2jv1x49s.jpg" />
                     <span style="text-align: center;">
                        <br />
                        <img src="http://obsession27.free.fr/boutons/iconvanessahudgensol44.jpg" />
                        <font size="3">Eléna Stewart</font>
                        <a href="URL DE L'ADRESSE">> Voir son profil <</a><br />
                        <a href="URL DE L'ADRESSE">> Qui est-elle ? <</a><br />
                     </span>
                  </div>
               </td>
            </tr>
         </table>
      </td>
   </tr>
</table>
</div>

Les problèmes que moi je soulève :
- L'image de fond fait 875px de large, si on veut éviter que ça rende moche (répétition horizontale), il faut que l'en-tête tienne dans 875px de large, c'est pas négociable.
- Tel que c'était codé, ça imposait 400px de large pour la cellule centrale et 254px de large pour les colonnes sur le côté. Faites le calcule, on essaie de faire rentrer un truc de 908pixels de large dans une boite qui n'en fait que 875pixels.
- Les titres sont définis dans le CSS comme faisant 250px de large. C'est le cas ici, ça a été, je suppose, commandé comme ça, donc pas de détraquement là dedans.
- Il y a un CSS bizarre qui demande des bordures, mais utilisé n'importe comment, ce qui donne un résultat fort curieux.

Bref, c'est du grand n'importe quoi.

Bref, réajustement du CSS :

Code:: /*-----------------------------------------------------------------------------
-------------------------------------------------------------------------------
CSS DU MESSAGE D'ACCUEIL
-------------------------------------------------------------------------------
-----------------------------------------------------------------------------*/

.m-a_perso {
background:url('http://img841.imageshack.us/img841/3092/plage.jpg') no-repeat top center;
color: black;
}

.m-a_grandtitre {
font-size:25px;
}

.msg-border {
border: #000 1px solid;
}

.msg-title {
background-color: #999;
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
text-align: center;
font-weight: bold;
padding: 2px;
color: #FFF;
border-bottom: 1px #000 solid;
background-image: url('http://www.imagehotel.net/images/je5fmh7n6o.jpg');
}

.navigateur {
text-decoration: blink;
font-weight: bold;
}

.navigateur:hover {
text-decoration: none;
}

/*------ Liens de navigation --------*/

.m-a_navigation a {
letter-spacing: 1px;
font-family: Georgia;
text-shadow: 3px 3px 5px #000000;
color: #bda985;
text-decoration: none !important;
font-size: 10px;
padding-left: 3px;
}

.m-a_navigation a:before {
content: "-";
}

.m-a_navigation a:hover {
color: #cbb793;
text-decoration: none !important;
}

.m-a_navigation a:hover:before {
content: "{";
}

/* ------- gestion des infobulles -------*/

div.infobullepa {
position: relative;
float: left;
}
div.infobullepa span {
display: none; /* ceci masque l'infobulle */
}

div.infobullepa:hover {
background: none; /* correction d'un bug IE */
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
}

div.infobullepa:hover span {
font-style: normal;
display: inline;
position: absolute;
top: 5px;
left: 5px;
background-color: #transparent;
color: #000000;
padding: 2px 5px;
border: 2px solid #57483B;
-moz-border-radius: 10px;
width:125px;
}

Whao , j'ai aussi mal codé que ca Sad

honte , honte , honte ..

Désolée, la structure était globalement correcte, mais y avait vraiment un certain nombre de trucs qui sont à éviter. ^^'

Lol , tu n'as pas a être désolée :') j'ai mal codé je l'assume :$ par contre je veux bien savoir
quel trucs était a évité Wink

Hum, il faudrait que je me replonge dans le code pour te le dire, mais je peux au moins te dire mes lignes de raisonnement quand je code et quand j'essaie de débugguer un code :
- @_@ Il. Faut. Indenter. Le. Code. Sérieusement, c'est vachement plus lisible et relisible quand c'est indenté ! Et on voit bien plus vite les erreurs de balises.
- Pas de styles dans le HTML, le plus possible. Ça évite ensuite de s'embrouiller et ça facilite la personnalisation. Dans ton cas, il y avait des styles en plus des classes, risque de télescopage involontaire garanti @_@

Après, il y a les trucs plus pointus du genre éviter de mettre des div partout (tes titres auraient très bien été aussi sous formes de balises < h1 >) ou éviter d'utiliser des balises obsolètes ( les < center >, < font > et compagnie)

Mais quelque chose me perturbe, quand tu as re codé le message d'accueil, tu as montré un aperçu qui était tout à fait correct, alors d'où venaient ces dimensions qui faisaient planter la version de "icipourapprendre" ? (huhu XD) Au final, tu avais corrigé ton CSS en fait, non ?

Euh , bah je me rappelle plus en fait O_O

Ah super sa commence à reprendre forme ^^

merci beaucoup

alors par contre pour l'encadré "top-partenaires" je voudrais qu'il soit moins long en hauteur, si possible qu'il arrive juste en dessous les étoiles, si possible également qu'il y ai 5 étoiles à chaque ligne.

de même pour l'encadré "staff" j'aimerais qu'il soit moins long.

et une dernière chose pour l'encadré du contexte j'aimerais si c'est possible qu'il soit moins large sans pour autant que ça détraque les autres encadrés.

Voilà j'espère que je me suis bien exprimé et que l'on pourra encore m'aider comme cela a été fait =)

en tout cas merci pour cela.

ça prend forme d'une commande là Ôo

Je ne pense pas ou si c'est le cas c'était pas volontaire, mais j'ai déjà posté partie commande et on me la remis ici parce qu'on m'a dit qu'étant donné que les codes étaient déjà existant ce n'était pas une commande.

Mise en forme d'une PA

Mise en forme d'une PA

Sujets similaires

Sujets similaires

Partenaires Or