Problème de code fiche RPG

[kiarie]

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Internet Explorer
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Moi uniquement
Lien du forum : http://life-in-ny.forumactif.com/

Description du problème

Bonjour a tous!

Alors voila je viens vers vous car j'ai un soucis avec un code que j'utilise pour faire la présentation de mon personnage et vu que je maîtrise assez mal la chose je n'arrive pas a résoudre le problème.

Mon probleme principal est que je ne comprends pas l'espace entre mes deux "div/tableau" je voudrais que l'espace soit normal entre eux deux comme c'est le cas dans une autre fiche que j'ai fais avec le même code sauf que dessus les tableaux sont cote a cote au lieu d'etre l'un en dessous de l'autre (http://www.life-in-ny.com/t995-connor-link#18256)

Mon deuxième soucis est que j'aimerais que le contour des cadres de titre soit arrondi de la même façon que l'est le cadre de l'avatar mais encore une fois je n'y arrive pas.

Voici mon code qui contient mes deux demande

Code:

<center><div style="width: 450px; background-color: #89BB99; text-align: justify; border: 1px solid; border-color: #467B46; center"><div style="padding:10px;"><center>[size=19][font=Calibri]STORY[/font][/size]</center></div></center></div>
<table><td><table><td><img src="http://kiarie.free.fr/eden/portfolio/montage/13.jpg"  width="105" height="170" style="border:1px solid #E6C3D0; padding:2px; width: 105px;  align="left" alt="2" style="margin-right:10px; margin-left:10px; margin-bottom:4px; "></td>
<td><div style="width: 155px, height: 30px">
[center][font=ms mincho][size=11]2013 / 2014[/size][/font][/center]
[font=ms mincho]<div style="margin:auto;text-align:center;width:100%">-------------------------</div>[/font]</div><div style="width: 400px; height: 200px; overflow:auto; text-align:justify;"">[i]bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla [/i]
[size=9]© WOODSPOON ET CREDITIMAGE[/size]</div></td></table>

<table><td><img src="http://scott99.free.fr/kitharington/crackship/montage2.jpg"  width="105" height="170" style="border:1px solid #E6C3D0; padding:2px; width: 105px;  align="left" alt="2" style="margin-right:10px; margin-left:10px; margin-bottom:4px; "></td>
<td><div style="width: 155px, height: 30px">
[center][font=ms mincho][size=11]2015[/size][/font][/center]
[font=ms mincho]<div style="margin:auto;text-align:center;width:100%">-------------------------</div>[/font]</div><div style="width: 400px; height: 200px; overflow:auto; text-align:justify;"">[i]bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla [/i]
[size=9]© WOODSPOON ET CREDITIMAGE [/size]</div></td></table></td></table>

Merci d'avance!

[MlleAlys]

Bonjour !
comme ça ?

Code:

<div style="width: 450px; background-color: #89BB99; text-align: center; border: 1px solid #467B46; border-radius: 10px; padding:10px; font-size:19px; font-family: calibri;">STORY</div>

<table><tr><td style="vertical-align: bottom;"><img src="http://kiarie.free.fr/eden/portfolio/montage/13.jpg" style="border:1px solid #E6C3D0; margin-right:10px; width: 105px; height:170px;" /></td>
<td><div style="width: 150px; padding:5px; margin:auto; text-align:center; font-family:'ms mincho'; font-size:11px; border-bottom: 1px dashed black;">2013/2014</div>
<div style="width: 400px; height: 150px; overflow:auto; text-align:justify; font-style: italic; margin-bottom:5px;">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
[size=9]© WOODSPOON ET CREDITIMAGE[/size]</div></td></tr>
<tr><td style="vertical-align: bottom;"><img src="http://scott99.free.fr/kitharington/crackship/montage2.jpg"style="border:1px solid #E6C3D0; margin-right:10px; width: 105px; height:170px;" /></td>
<td><div style="width: 150px; padding:5px; margin:auto; text-align:center; font-family:'ms mincho'; font-size:11px; border-bottom: 1px dashed black;">2015</div>
<div style="width: 400px; height: 150px; overflow:auto; text-align:justify; font-style: italic;margin-bottom:5px;">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
[size=9]© WOODSPOON ET CREDITIMAGE[/size]</div></td></tr></table>

pour l'arrondi des coins, c'est border-radius la propriété ^^
et j'ai tout mis dans le même tableau pour simplifier ^^

[kiarie]

Haaannn merci!!!! *.*

Enfin j'ai appliqu" ton code, il marche nickel par contre du coup maintenant il y a un gros espace entre le cadre titre et les autres tableaux XD

http://www.life-in-ny.com/t996-connor-subject#18259

[MlleAlys]

ah oui pardon !
essaye de juste retirer les deux retours à la ligne dans le code, voir si ça te va,
et si ça n'est toujours pas assez, comme ça :

Code:

<div style="width: 450px; margin:auto; background-color: #89BB99; text-align: center; border: 1px solid #467B46; border-radius: 10px; padding:10px; font-size:19px; font-family: calibri;">STORY</div>
<table style=" margin:auto;"><tr><td style="vertical-align: bottom;"><img src="http://kiarie.free.fr/eden/portfolio/montage/13.jpg" style="border:1px solid #E6C3D0; margin-right:10px; width: 105px; height:170px;" /></td><td><div style="width: 150px; padding:5px; margin:auto; text-align:center; font-family:'ms mincho'; font-size:11px; border-bottom: 1px dashed black;">2013/2014</div>
<div style="width: 400px; height: 150px; overflow:auto; text-align:justify; font-style: italic; margin-bottom:5px;">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
[size=9]© WOODSPOON ET CREDITIMAGE[/size]</div></td></tr><tr><td style="vertical-align: bottom;"><img src="http://scott99.free.fr/kitharington/crackship/montage2.jpg"style="border:1px solid #E6C3D0; margin-right:10px; width: 105px; height:170px;" /></td><td><div style="width: 150px; padding:5px; margin:auto; text-align:center; font-family:'ms mincho'; font-size:11px; border-bottom: 1px dashed black;">2015</div>
<div style="width: 400px; height: 150px; overflow:auto; text-align:justify; font-style: italic;margin-bottom:5px;">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
[size=9]© WOODSPOON ET CREDITIMAGE[/size]</div></td></tr></table>

[kiarie]

ça marche avec les retour de lignes. Tu es une déesse et mois vraiment nul x)

Tant que je t'ai sous la main (oui j'aime profiter des gens) tu peux peu être m'aidé sur un autre probleme pas bien grave mais qui m'agace depuis un certain temps car je ne comprends pas d'ou ça vient.

Si tu passe la souris sur les avatars du forum tu peux voir qu'il y a un voile dessus. Je ne sais pas d'ou il vient et j'aimerais bien le virer. Voici mon code css (je ne suis pas sur que la fin appartienne aussi a la partie avatar XD)

Code:

.vava {
border:2px #467b46 solid;
background-color: #89bb99;
border-radius:10px;
border-radius:10px;
border-radius:10px;
border-radius:10px;
margin: 5px;
padding: 5px;
}

.vava2 {
border:2px #467b46 solid;
background-color: #89bb99;
border-radius:10px;
border-radius:10px;
border-radius:10px;
border-radius:10px;
margin: 5px;
padding: 5px;
font-size: 10px; 
}

/* Profil Masqué */
.profilmasque {
    background-color: #89bb99;
    border: 2px solid #467b46;
    border-radius: 10px;
    font-size: 10px;
    letter-spacing: 1px;
    margin: 3px;
    width: 215px;
}

textarea {
    border-width: 1px;
    width: 200px; /* Largeur 200px */
}

.profil1/*c'est le css de l'ensemble bouton+profil*/
{
width: 200px;
background-color: #89bb99;
border: none;
font-size: 9px;
letter-spacing: 2px;
font-weight: bold;

Tu vois se qui génère le voile? Parce que moi je comprends pas.

[MlleAlys]

Le code coupable n'est pas dans ceux que tu as donnés, c'est ce code là :

Code:

.opacity img {
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
}

Ce n'est pas un voile mais l'image qui est légèrement transparente en fait (opacité à 0.7 au lieu de 1 ; 0=complètement transparent, 1=complètement opaque) ^^

Si cet effet n'est utilisé nulle part ailleurs, tu peux supprimer tout ce code ^^

[kiarie]

Tu es tellement merveilleuse *.* Merci beaucoup pour ton aide tu as illuminé ma journée! \0/

[MlleAlys]

de rien,
n'oublie pas d'éditer ton premier message pour passer le sujet en résolu !

[kiarie]

C'est fait! Encore merci!