Centrer verticalement et horizontalement, des éléments dans un tableau.

2 participants

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

Résolu Centrer verticalement et horizontalement, des éléments dans un tableau.

Message par Mohnn Lun 26 Aoû 2013 - 2:16

Bonjour à toutes et à tous,

Je suis venue vous voir il y a peu pour un problème pour centrer mon tableau qui était à la base dans une bulle. Finalement à la demande des joueurs et des autres membres de l'administration de mon forum nous changeons la presque entièrement la mise en page. Je m'excuse donc auprès des membres qui m'ont aidés la dernière fois pour leur avoir fait perdre leur temps.

Cette fois ci sera la bonne.

Mon tableau est divisé en 3 colonnes contenant diverses choses chacunes. Je souhaiterais les centrer à la vertical, que la hauteur au dessus et en dessous des éléments soit de la même taille. Ainsi que la distance sur les côtés.

J'ai essayé de faire avec les marges ou simplement en centrant mais rien n'y fait ça ne fonctionne pas.

Centrer verticalement et horizontalement, des éléments dans un tableau. Otsu10

Voici mon code :

Code:
<table style="width:450px; height:auto; margin:auto; border: 4px solid #333333; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;padding-left: 20px; padding: 5px;"><tbody><tr><td style="img-align: center;" rowspan="1" valign="top" width="200" height="auto"><span style="display: block; -align: center; width: 150px; height: 150px; border-radius: 100px; border: 2px solid #333333; background: url(http://r19.imgfast.net/users/1911/11/51/43/avatars/11-5.jpg);"><br></span></td><td style="text-align: center;" rowspan="2" valign="top" width="300"><div style="border: 3px ; letter-spacing: 1px; font-size: 10px; font-family: " komika""=""><div style="text-align: left;"><font size="2"><span style="font-family: komika;"><span style="text-decoration: underline;"><br><span style="font-family: Fixedsys;">Nom</span></span><span style="font-family: komika;"> : Inconnu<span style="text-decoration: underline;"><br>Prénom</span> : July<span style="text-decoration: underline;"><br></span></span></span><span style="font-family: komika;"><span style="text-decoration: underline;"></span><span style="text-decoration: underline;">Emploi à Otsu</span> : Infirmier<span style="text-decoration: underline;"><br>Age</span> : Indéfini, en apparence il a 18 ans.<span style="text-decoration: underline;"><br>Espèce</span> : Vampire </span></font></div></div></td>
<td rowspan="3" valign="top" width="200"><div style="border: 3px ; letter-spacing: 1px; font-size: 10px; font-family: " komika"="">
<span style="font-family: komika;"><span style="display: block; text-align: center; font-size: 15px; front-family: komika; color: #320E15; padding-top: 5px;"><br><br><span style="font-family: komika;"><a href="http://otsu.forumactif.com/t436-jul-july">Fiche Personnage</a><br><br><a href="http://otsu.forumactif.com/sta/july">Fiche Rp</a></span></span></span></div></td>
</tr></tbody></table></div>
Merci d'avance,

Mohnn.


Dernière édition par Mohnn le Lun 26 Aoû 2013 - 23:09, édité 1 fois
avatar

Mohnn
***

Féminin
Messages : 105
Inscrit(e) le : 21/05/2011

Voir le profil de l'utilisateur http://otsu.forumactif.com/forum
Mohnn a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer verticalement et horizontalement, des éléments dans un tableau.

Message par Mohnn Lun 26 Aoû 2013 - 18:36

up s'il vous plait
avatar

Mohnn
***

Féminin
Messages : 105
Inscrit(e) le : 21/05/2011

Voir le profil de l'utilisateur http://otsu.forumactif.com/forum
Mohnn a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer verticalement et horizontalement, des éléments dans un tableau.

Message par Scoubifitz Lun 26 Aoû 2013 - 21:59

bonsoir,

un code simplifié (et on peut encore le simplifier Very Happy  ) , vous pouvez jouer sur la largeur de chaque cellule :

Code:
<table style=" margin:auto; border: 4px solid #333333; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;padding-left: 20px; padding: 5px;"><tr><td style="width: 180px"><div style="margin:auto; width: 150px; height: 150px; border-radius: 100px; border: 2px solid #333333; background: url(http://r19.imgfast.net/users/1911/11/51/43/avatars/11-5.jpg);"> </div></td> <td style="width:250px"> <div style=" letter-spacing: 1px; font: 13px komika;"> <span style="font-family: Fixedsys;"><u>Nom</u></span> : Inconnu<br> <u>Prénom</u> : July<br> <u>Emploi à Otsu</u> : Infirmier<br> <u>Age</u> : Indéfini, en apparence il a 18 ans.<br> <u>Espèce</u> : Vampire </div></td> <td style="width:140px;"><div style="letter-spacing: 1px; text-align: center; font: 15px komika; color: #320E15;"><a href="http://otsu.forumactif.com/t436-jul-july">Fiche Personnage</a><br><br><a href="http://otsu.forumactif.com/sta/july">Fiche Rp</a></div></td></tr></table>
Scoubifitz

Scoubifitz
Membre actif

Masculin
Messages : 3679
Inscrit(e) le : 18/03/2008

Voir le profil de l'utilisateur http://scoubidous.superforum.fr/
Scoubifitz a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer verticalement et horizontalement, des éléments dans un tableau.

Message par Mohnn Lun 26 Aoû 2013 - 23:08

Bonsoir,

Merci c'est parfait ça fonctionne comme il faut.

Bonne soirée.

Mohnn.
avatar

Mohnn
***

Féminin
Messages : 105
Inscrit(e) le : 21/05/2011

Voir le profil de l'utilisateur http://otsu.forumactif.com/forum
Mohnn 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