/* PAGE D'ACCUEIL PAR ORANGE DE CSSACTIF (http://www.css-actif.com/)
MERCI DE NE PAS RETIRER CETTE MENTION, PAR RESPECT. */
/* Mise en forme générale */
  .cssactif_pa_main {
      width: 800px; 
      padding: 30px;
      margin: 0 auto;
  }
 
  .cssactif_pa_main h1 { /* Titre principal (Bienvenue sur...) */
      font-family: "Courier New", Courier, monospace;  /* Police de caractère */
      text-align: center; /* Alignement du texte */
      text-transform: uppercase; /* Transformation: met le texte en majuscules */
      font-weight: épais; /* Épaisseur normale */
      letter-spacing: 16px; /* Espacemement des caractères en PX */
      font-size: 32px; /* Grosseur du texte */
      color: #5E3B4F; /* Couleur du texte */
      text-shadow: 2px 2px 0px #000000; /* Ombre du texte */
  }
 
  .cssactif_pa_main h2 { /* Titre des colonnes (Contexte, Nouveautés etc.) */
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;    /* Police de caractère */
      font-weight: normal; /* Épaisseur normale */
      color: #E0D0AE; /* Couleur du texte */
      text-transform: uppercase; /* Transformation: met le texte en majuscules */
      text-shadow: 1px 1px 1px #000000; /* Ombre du texte */
      font-size: 18px; /* Grosseur du texte */
      margin:0;
  }
 
  .cssactif_pa_colonne { /* Style général des colonnes */
      float: left; /* Place les colonnes un à côté de l'autre */
      width: 33%; /* Donne la grandeur des colonnes */
      background-color: #CCBB9F; /* Couleur de fond */
      height: 400px; /* Hauteur des colonnes: doit être fixe */
      color: #5E3B4F; /* Couleur du texte */
 
      opacity: 0.9; /* Opacité des colonnes */
     
      /* Transition */
      -webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;

/*Ombre porté */
-webkit-box-shadow: 0px 0px 1px 0px #CCCCCC;
box-shadow: 0px 0px 1px 0px #CCCCCC;

 
  }
 
  .cssactif_pa_colonne p { /* Paragraphe des colonnes */
  padding: 0 10px; /* Padding */
  text-indent: 10px; /* Alinéa */
  text-align: justify;  /* Alignement du texte */
  }
  .cssactif_pa_colonne:hover { /* Colonne au survol */
  /* Effet de grossissement */
      -moz-transform: scale(1.05) translate(0px, -20px) ;
-webkit-transform: scale(1.05) translate(0px, -20px) ;
-o-transform: scale(1.05) translate(0px, -20px) ;
-ms-transform: scale(1.05) translate(0px, -20px);
transform: scale(1.05) translate(0px, -20px) ;

opacity: 1; /* Opacité */

/* Nouvelle ombre portée */
-webkit-box-shadow: 0px 5px 10px 0px #CCCCCC;
box-shadow: 0px 5px 10px 0px #CCCCCC;
z-index: 999;

  }
 
.cssactif_pa_header { /* Style commun des header de couleur */
  padding: 10px;
  height: 80px;
}

.cssactif_pa_header p { /* Style du description dans les headers */
margin: 5px; /* Marge */
padding: 0; /* Padding */
color: #E0D0AE; /* Couleur du texte */
text-shadow: 1px 1px 1px #000000;  /* Ombre portée */
font-style: italic; /* Style italic */
opacity: 0.8; /* Opacity du texte */

}
.colgauche .cssactif_pa_header {background-color: #5E3B4F;} /* Colonne de gauche, couleur du header */
.colcentre .cssactif_pa_header {background-color: #5E3B4F;}/* Colonne du centre, couleur du header */
.coldroite .cssactif_pa_header {background-color: #5E3B4F;} /* Colonne de droite, couleur du header */
/* Contenu des colonnes */

.new {
  margin: 0px 10px 5px 10px; /* Marge Haut Droit Bas Gauche */
  padding: 5px; /* Padding */
  border-bottom: 1px solid #ffffff; /* Bordure du séparateur */
 
  text-align: justify; /* Alignement du texte */
}

.new em { /* Dates */
  color: #5E3B4F;  /* Couleur du texte */
  text-transform: uppercase; /* Transformation du texte en majuscule */
  font-style: normal; /* Enlève le italic par défaut de la balise em */
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; /* Police de caractère */
}



.pers { /* Cadre des personnages */
 border: 1px solid #5E3B4F;  /* Bordure des personnages */
 margin: 10px; /* marge externe */
 
 /* Arrondissement des bordures */
 -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;


padding: 3px; /* Marge interne */
text-align: center; /* Alignement du texte */
}

.pers img { /* Image des personnages */
 float: left; /* Place à gauche du texte */
 width: 50px; /* Grandeur de l'image */
 height: 50px;    /* Grandeur de l'image */
 border: 3px solid #5E3B4F; /* Bordure de l'image */
 
 /* Arrondissement des bordures */
  -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;   

/* Transformation */
 -moz-transform: rotate(-12deg) translate(0px, -5px) ;
-webkit-transform:  rotate(-12deg) translate(0px, -5px) ;
-o-transform: rotate(-12deg) translate(0px, -5px) ;
-ms-transform:  rotate(-12deg) translate(0px,-5px) ;
transform:  rotate(-12deg) translate(0px, -5px);
}

.pers:first-line { /* Première ligne:contient le nom du personnage */
 color: #5E3B4F;/* Couleur du texte */
 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; /* Police de caractère */
 text-transform: uppercase; /* Transformation du texte */
}

/*FIN PAGE D'ACCUEIL*/


/*FICHES CHEVAUX*/

/*Encadré avec nom*/
.nomducheval {
    background-color: #CCBB9F;
  color: #5D3B4C;
  text-align: center;
  text-transform: capitalize;
  font-size: 50px;
  font-variant: small-caps;
  width: 600px;
  height: 60px;
  margin-left: 30%;
    margin-right: 30;
  margin-top: 1%
    margin-bottom: 1%;
  padding-top: 3%;
  padding-bottom: 1%;
}

/*Encadré image*/
.imageducheval {
  border-style: solid;
  border-color: #5D3B4C;
  width: 200px;
  height: 400px;
  margin-left: 20%;
}

/*Encadré avec description*/
.physique {
    background-color: #CCBB9F;
  color: #5D3B4C;
  text-align: justify;
  font-size: 15px;
  width: 500px;
  height: 150px;
  margin-left: 0%;
    margin-right: 10%;
  margin-top: 1%
    margin-bottom: 1%;
  padding-top: 0%;
  padding-bottom: 0%;
  padding-left: 1%;
  padding-right: 0%;
  line-height: 200%;
  float: right;
}

<div class=imageducheval>[img]http://i75.servimg.com/u/f75/17/65/26/51/who10.jpg[/img]<div class=physique>Age :
Sexe :
Race :
Robe :
Taille :</div>

<img src="URL" class="flottantgauche" />

.flottantgauche {
float: left;
}