Mise en forme d'une PA - Page 3 Bouton_activeMise en forme d'une PA - Page 3 Bouton_hoverMise en forme d'une PA - Page 3 Fb-hoverMise en forme d'une PA - Page 3 Fb-active
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Système d'onglets simple et personnalisable
Mise en forme d'une PA - Page 3 EmptyLun 03 Juin 2024, 17:20 par birds

» Fiche de Présentation RPG
Mise en forme d'une PA - Page 3 EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Mise en forme d'une PA - Page 3 EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Mise en forme d'une PA - Page 3 EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Mise en forme d'une PA - Page 3 EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Mise en forme d'une PA - Page 3 EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Mise en forme d'une PA - Page 3 EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Mise en forme d'une PA - Page 3 EmptySam 11 Fév 2023, 06:04 par Krager

-48%
Le deal à ne pas rater :
Philips Hue Pack Decouverte 2024 : lightstrip 3M + ampoules E27 X2 + ...
119 € 229 €
Voir le deal

Partagez
 

Mise en forme d'une PA

Voir le sujet précédent Voir le sujet suivant Aller en bas 
Aller à la page : Précédent  1, 2, 3
Invité
Invité




Mise en forme d'une PA - Page 3 Empty
Ok ok, bon je laisse le temps aux autres de t'aider alors Wink
MessageSujet: Re: Mise en forme d'une PA   Mise en forme d'une PA - Page 3 EmptyLun 20 Déc 2010, 10:10
Revenir en haut Aller en bas
icipourapprendre
icipourapprendre
{ Membre }
{ Membre }

Féminin Messages : 65



Mise en forme d'une PA - Page 3 Empty
D'accord merci =)
MessageSujet: Re: Mise en forme d'une PA   Mise en forme d'une PA - Page 3 EmptyLun 20 Déc 2010, 10:13
Revenir en haut Aller en bas
http://enaevolare.fr
'Christa
'Christa
Lostmindy
Lostmindy

Féminin Messages : 2856



Mise en forme d'une PA - Page 3 Empty
Sigh. Pour le coup des étoiles, tu n'as qu'à en prendre de plus petites =_=

Pour le reste, c'est moche, mais c'est ton choix :

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 msg-contexte">
               <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" align="center">
            <div class="msg-border">
               <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>
            </div>
         </td>
         
          <td width="25%" valign="top"align="center">
            <div class="msg-border">
               <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>
            </div>
         </td>
      </tr>
   </table>
</div>

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');
}

.msg-contexte {
   width:300px;
   margin:auto;
}

.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;
}
MessageSujet: Re: Mise en forme d'une PA   Mise en forme d'une PA - Page 3 EmptyLun 20 Déc 2010, 12:17
Revenir en haut Aller en bas
icipourapprendre
icipourapprendre
{ Membre }
{ Membre }

Féminin Messages : 65



Mise en forme d'une PA - Page 3 Empty
merci Smile

donc si je veux changer l'image de fond il faut qu'elle fasse quoi comme taille ?
MessageSujet: Re: Mise en forme d'une PA   Mise en forme d'une PA - Page 3 EmptyLun 20 Déc 2010, 14:57
Revenir en haut Aller en bas
http://enaevolare.fr
'Christa
'Christa
Lostmindy
Lostmindy

Féminin Messages : 2856



Mise en forme d'une PA - Page 3 Empty
Lostmindy a écrit:
- 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.
En d'autres termes, ton image doit être PLUS LARGE et PLUS HAUTE que ce qu'il y aura dans ton en-tête. Ça me paraît logique, t'aurais l'air con avec un timbre poste en guise de fond.
MessageSujet: Re: Mise en forme d'une PA   Mise en forme d'une PA - Page 3 EmptyLun 20 Déc 2010, 16:04
Revenir en haut Aller en bas
icipourapprendre
icipourapprendre
{ Membre }
{ Membre }

Féminin Messages : 65



Mise en forme d'une PA - Page 3 Empty
d'accord merci alors je pense qu'on peut fermer.

merci pour votre aide =)
MessageSujet: Re: Mise en forme d'une PA   Mise en forme d'une PA - Page 3 EmptyLun 20 Déc 2010, 16:22
Revenir en haut Aller en bas
Invité
Invité




Mise en forme d'une PA - Page 3 Empty
J'archive =)
MessageSujet: Re: Mise en forme d'une PA   Mise en forme d'une PA - Page 3 EmptyLun 20 Déc 2010, 17:50
Revenir en haut Aller en bas
Contenu sponsorisé




Mise en forme d'une PA - Page 3 Empty
MessageSujet: Re: Mise en forme d'une PA   Mise en forme d'une PA - Page 3 Empty
Revenir en haut Aller en bas
 

Mise en forme d'une PA

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 3 sur 3Aller à la page : Précédent  1, 2, 3

 Sujets similaires

-
» Mise en forme
» Mise en forme d'une PA
» Mise en forme pa
» Mise en forme de message personnalisé
» [Résolu] Problème de mise en forme

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Cookies | Forum gratuit