Accueil
Créer un forumProblème HTML
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Problème HTML
par CryingToYourHeart Lun 25 Juin 2012 - 19:48
Bonjour,
J'ai actuellement un petit problème avec mon code HTML, en effet pour montrer les divers scénarios j'ai mis les images des personnages concernés sauf qu'ils ne sont pas tous alignés et ce n'est pas très jolie, voyez ci dessous:
Ayant peur de faire une bêtise je viens vous demander conseil pour savoir si quelqu'un de plus expérimenté que moi sait, voici donc le code concerné:
Merci à ceux qui voudront bien m'aider
J'ai actuellement un petit problème avec mon code HTML, en effet pour montrer les divers scénarios j'ai mis les images des personnages concernés sauf qu'ils ne sont pas tous alignés et ce n'est pas très jolie, voyez ci dessous:
- Code:
http://thewerewolfpack.forumgratuit.org/h2-info
Ayant peur de faire une bêtise je viens vous demander conseil pour savoir si quelqu'un de plus expérimenté que moi sait, voici donc le code concerné:
- Code:
<HTML>
<HEAD><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style type="text/css">
.titree{
letter-spacing: -2px;
font-family:rockwell;color:c9909f;
font-size:22px;
font-weight:lighter;
text-align:center;
text-transform:uppercase;
text-shadow: #000000 0px 1px 1px;
}
.groupes{font-family:arial;font-size:10px;text-transform:uppercase;font-weight:bold;}
.celeb {
font-family:arial;
font-size:11px;
color: #94776f
}
.navig{
font-family:arial;font-size:10px;width:90px;text-transform:uppercase;color:#91776b;font-weight:bold;text-align:center;}
a:link, a:active, a:visited{color:#ad948a;
text-decoration: none !important;}
a:hover{
color:#ad948a;}
/* ----------- STAFF --------------- */
/* PARTIE SLIDE */
.tfa_staff_code{
width: 200px;
margin: 0 auto;
padding: 0;
position: relative;
overflow: hidden;
}
.tfa_staff_code div{
width: 200px;
margin: 0 auto;
padding: 0;
text-align: center;
position: relative;
}
/* STAFF */
/* BLOC DE CONTENU */
#staff_code_TFA{
width: 200px;
margin: 0 auto;
padding: 5px;
background: #f8eee9;
border: 0px solid #004956;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
/* CADRE AFFICHANT LES INFOS DU STAFF */
.info_staff{
width: 145px;
height:80px;
margin: 0 auto;
padding-right: 8px;
padding-top:2px;
padding-bottom:2px;
padding-left:8px;
border: 0px solid #126f74;
background-color:#f8eee9;
text-align:center;
color: #91776b;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
</style>
</HEAD>
<table><tr><td><div style="background-color:#f8eee9;-moz-border-radius:10px;font-size:11px;font-family:arial;color:#91776b;width:200px;text-align:justify;"><img src="http://img854.imageshack.us/img854/2329/98497925.png" width="60" style="position:absolute;margin-top:-5px;margin-left:-10px;"><span class="titree"><div style="margin-left:20px;">Intrigue</div></span><div style="-moz-border-radius:10px;border-radius:10px;-webkit-border-radius:10px;background-color:#f8eee9;padding:5px;"><img src="http://i40.tinypic.com/snmkq8.jpg" style="float:left;padding-right:15px;padding-bottom:3px;"></a>« blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah <a href="http://temptationisland.forum.st/t153-intrigues-du-forum" target="_blank">★ MORE</a> »</div></div><br><span class="titree"><center>Mission</center></span><div style="-moz-border-radius:10px;border-radius:10px;-webkit-border-radius:10px;background-color:#f8eee9;padding:5px;"><img src="http://i40.tinypic.com/snmkq8.jpg" style="float:left;padding-right:2px;padding-bottom:3px;"></a> <table><tr><td><div class="celeb">Envie de s'amuser ? De nouveautés ? Rend toi dans la partie Mission, retrouve régulièrement pleins d'activités à faire sur le forum. Pimente ton jeu, pimente celui des autres, devient le maitre du jeu et tout ça en quelques clicks, alors dépêche toi et viens t'amuser avec nous <a href="http://temptationisland.forum.st/t153-intrigues-du-forum" target="_blank">★ MORE</a></div> </td></tr></table> </div></div><br><br>
</td><td><div style="margin-left:240px;">
<!-- DEBUT CODES STAFF --> <div id="staff_code_TFA">
<!-- LE TITRE -->
<center><span class="titree">Prédéfinis</span></center>
<!-- DEBUT SLIDE (ONGLETS) AVATARS -->
<div class="tfa_staff_code">
<!-- ICI TU METS 4 AVATARS -->
<div>
<a href="#" onmouseover="Monter_Cacher('staff1'); return false"><img src="http://img846.imageshack.us/img846/3515/tomw.png" width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff2'); return false"><img src="http://img687.imageshack.us/img687/236/paulw.png" width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff3'); return false"><img src="http://img844.imageshack.us/img844/3407/joez.png"width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff4'); return false"><img src="http://img560.imageshack.us/img560/2958/ianx.png"width=50 height=50 class="opacity_8"/></a>
</div>
<!-- ICI TU METS 4 AVATARS -->
<div><a href="#" onmouseover="Monter_Cacher('staff5'); return false"><img src="http://img232.imageshack.us/img232/3047/beng.png" width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff6'); return false"><img src="http://img684.imageshack.us/img684/7969/ashleyl.png" width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff7'); return false"><img src="http://img209.imageshack.us/img209/5981/alexcc.png"width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff8'); return false"><img src="http://img209.imageshack.us/img209/5981/alexcc.png"width=50 height=50 class="opacity_8"/></a>
</div>
</div>
<!-- FIN SLIDE (ONGLETS) AVATARS -->
<!-- DEBUT DU CONTENU DES ONGLETS (AVATARS) --> <div id="container_tfa_code">
<!-- CONTENU 1 CORRESPOND A L AVATAR 1 -->
<div id="staff1">
<div class="info_staff">
<span class="nom">Kyle Kelleen</span><br/>
<span class="celeb"> feat Tom Felton<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t49-kyle-kelleen-ft-tom-felton" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 2 CORRESPOND A L AVATAR 2 -->
<div id="staff2">
<div class="info_staff">
<span class="nom"> Drew Stevenson</span><br/>
<span class="celeb"> feat Paul Wesley<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t77-drew-stevenson-ft-paul-wesley" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 3 CORRESPOND A L AVATAR 3 -->
<div id="staff3">
<div class="info_staff">
<span class="nom"> Josh Andrews</span><br/>
<span class="celeb"> feat Joe Jonas<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t75-josh-andrews-ft-joe-jonas" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 4 CORRESPOND A L AVATAR 4 -->
<div id="staff4">
<div class="info_staff">
<span class="nom"> Derek Lucas Cartier</span><br/>
<span class="celeb"> feat Ian Somerhalder<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t74-derek-lucas-cartier-ft-ian-somerhalder" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 5 CORRESPOND A L AVATAR 5 -->
<div id="staff5">
<div class="info_staff">
<span class="nom"> Dorian H. Nicolson</span><br/>
<span class="celeb"> feat Ben Barnes<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t72-dorian-h-nicolson-ft-ben-barnes" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 6 CORRESPOND A L AVATAR 6 -->
<div id="staff6">
<div class="info_staff">
<span class="nom"> Desteny H. Callini</span><br/>
<span class="celeb"> feat Ashley Greene<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t48-desteny-h-callini-ft-ashley-greene" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 7 CORRESPOND A L AVATAR 7 -->
<div id="staff7">
<div class="info_staff">
<span class="nom"> Tyron Miller</span><br/>
<span class="celeb"> feat Alex Meraz<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t71-tyron-miller-ft-alex-meraz" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 8 CORRESPOND A L AVATAR 8 -->
<div id="staff8">
<div class="info_staff">
<span class="nom"> Tyron Miller</span><br/>
<span class="celeb"> feat Alex Meraz<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t71-tyron-miller-ft-alex-meraz" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
</div>
<!-- FIN DU CONTENU DES ONGLETS (AVATARS) -->
</div>
<!-- FIN CODES STAFF -->
<script type="text/javascript">
function Monter_Cacher(id)
{
for(var i=1;i<=8;i++)
{
document.getElementById('staff'+i).style.display='none';
}
if(document.getElementById(id).style.display =='none')
{
document.getElementById(id).style.display = 'block';
}
}
Monter_Cacher('staff1');
</script> </div>
<br><div style="margin-left:300px;"><div style="background-color:#F8EEE9;-moz-border-radius:10px;font-size:11px;font-family:arial;color:#91776b;width:150px;text-align:justify;"><span class="titree"><div style="margin-left:20px;"><span class="titree"><center>Météo</div></center></span><div style="-moz-border-radius:10px;border-radius:10px;-webkit-border-radius:10px;background-color:#F8EEE9;padding:5px;"><span class="celeb"><div style="text-align:justify;padding-right:5px;">L'été sera chaud, l'été sera beau, c'est le moment idéal pour faire la fête !</div></span>
<center><table><td><img src="http://img4.hostingpics.net/pics/83120420738bubkasunny.png" style="padding-top:10px;padding-bottom:-10px;"></td><td><img src="http://img4.hostingpics.net/pics/16439621724bubkasunglasses.png"></td></table></center></div></div>
</td></tr></table>
</HTML>
Merci à ceux qui voudront bien m'aider
Dernière édition par CryingToYourHeart le Mer 27 Juin 2012 - 13:00, édité 1 fois
CryingToYourHeart- ****
-
Messages : 452
Inscrit(e) le : 18/01/2012 -
Imperatif- Nouveau membre
- Messages : 12
Inscrit(e) le : 11/06/2012 -
Re: Problème HTML
par CryingToYourHeart Mar 26 Juin 2012 - 15:34
Imperatif a écrit:Tu héberges ton code en iframe ?
Oui
CryingToYourHeart- ****
-
Messages : 452
Inscrit(e) le : 18/01/2012 -
Re: Problème HTML
par Invité Mer 27 Juin 2012 - 5:10
Bonjour ,
J'ai ajouter une propriété CSS à .tfa_staff_code div{ qui est : display: inline-table;
Voir le code ci-dessous :
Cordialement.
J'ai ajouter une propriété CSS à .tfa_staff_code div{ qui est : display: inline-table;
Voir le code ci-dessous :
- Code:
<HTML>
<HEAD><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style type="text/css">
.titree{
letter-spacing: -2px;
font-family:rockwell;color:c9909f;
font-size:22px;
font-weight:lighter;
text-align:center;
text-transform:uppercase;
text-shadow: #000000 0px 1px 1px;
}
.groupes{font-family:arial;font-size:10px;text-transform:uppercase;font-weight:bold;}
.celeb {
font-family:arial;
font-size:11px;
color: #94776f
}
.navig{
font-family:arial;font-size:10px;width:90px;text-transform:uppercase;color:#91776b;font-weight:bold;text-align:center;}
a:link, a:active, a:visited{color:#ad948a;
text-decoration: none !important;}
a:hover{
color:#ad948a;}
/* ----------- STAFF --------------- */
/* PARTIE SLIDE */
.tfa_staff_code{
width: 200px;
margin: 0 auto;
padding: 0;
position: relative;
overflow: hidden;
}
.tfa_staff_code div{
width: 200px;
margin: 0 auto;
display: inline-table;
padding: 0;
text-align: center;
position: relative;
}
/* STAFF */
/* BLOC DE CONTENU */
#staff_code_TFA{
width: 200px;
margin: 0 auto;
padding: 5px;
background: #f8eee9;
border: 0px solid #004956;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
/* CADRE AFFICHANT LES INFOS DU STAFF */
.info_staff{
width: 145px;
height:80px;
margin: 0 auto;
padding-right: 8px;
padding-top:2px;
padding-bottom:2px;
padding-left:8px;
border: 0px solid #126f74;
background-color:#f8eee9;
text-align:center;
color: #91776b;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
</style>
</HEAD>
<table><tr><td><div style="background-color:#f8eee9;-moz-border-radius:10px;font-size:11px;font-family:arial;color:#91776b;width:200px;text-align:justify;"><img src="http://img854.imageshack.us/img854/2329/98497925.png" width="60" style="position:absolute;margin-top:-5px;margin-left:-10px;"><span class="titree"><div style="margin-left:20px;">Intrigue</div></span><div style="-moz-border-radius:10px;border-radius:10px;-webkit-border-radius:10px;background-color:#f8eee9;padding:5px;"><img src="http://i40.tinypic.com/snmkq8.jpg" style="float:left;padding-right:15px;padding-bottom:3px;"></a>« blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah <a href="http://temptationisland.forum.st/t153-intrigues-du-forum" target="_blank">★ MORE</a> »</div></div><br><span class="titree"><center>Mission</center></span><div style="-moz-border-radius:10px;border-radius:10px;-webkit-border-radius:10px;background-color:#f8eee9;padding:5px;"><img src="http://i40.tinypic.com/snmkq8.jpg" style="float:left;padding-right:2px;padding-bottom:3px;"></a> <table><tr><td><div class="celeb">Envie de s'amuser ? De nouveautés ? Rend toi dans la partie Mission, retrouve régulièrement pleins d'activités à faire sur le forum. Pimente ton jeu, pimente celui des autres, devient le maitre du jeu et tout ça en quelques clicks, alors dépêche toi et viens t'amuser avec nous <a href="http://temptationisland.forum.st/t153-intrigues-du-forum" target="_blank">★ MORE</a></div> </td></tr></table> </div></div><br><br>
</td><td><div style="margin-left:240px;">
<!-- DEBUT CODES STAFF --> <div id="staff_code_TFA">
<!-- LE TITRE -->
<center><span class="titree">Prédéfinis</span></center>
<!-- DEBUT SLIDE (ONGLETS) AVATARS -->
<div class="tfa_staff_code">
<!-- ICI TU METS 4 AVATARS -->
<div>
<a href="#" onmouseover="Monter_Cacher('staff1'); return false"><img src="http://img846.imageshack.us/img846/3515/tomw.png" width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff2'); return false"><img src="http://img687.imageshack.us/img687/236/paulw.png" width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff3'); return false"><img src="http://img844.imageshack.us/img844/3407/joez.png"width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff4'); return false"><img src="http://img560.imageshack.us/img560/2958/ianx.png"width=50 height=50 class="opacity_8"/></a>
</div>
<!-- ICI TU METS 4 AVATARS -->
<div><a href="#" onmouseover="Monter_Cacher('staff5'); return false"><img src="http://img232.imageshack.us/img232/3047/beng.png" width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff6'); return false"><img src="http://img684.imageshack.us/img684/7969/ashleyl.png" width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff7'); return false"><img src="http://img209.imageshack.us/img209/5981/alexcc.png"width=50 height=50 class="opacity_8"/></a>
<a href="#" onmouseover="Monter_Cacher('staff8'); return false"><img src="http://img209.imageshack.us/img209/5981/alexcc.png"width=50 height=50 class="opacity_8"/></a>
</div>
</div>
<!-- FIN SLIDE (ONGLETS) AVATARS -->
<!-- DEBUT DU CONTENU DES ONGLETS (AVATARS) --> <div id="container_tfa_code">
<!-- CONTENU 1 CORRESPOND A L AVATAR 1 -->
<div id="staff1">
<div class="info_staff">
<span class="nom">Kyle Kelleen</span><br/>
<span class="celeb"> feat Tom Felton<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t49-kyle-kelleen-ft-tom-felton" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 2 CORRESPOND A L AVATAR 2 -->
<div id="staff2">
<div class="info_staff">
<span class="nom"> Drew Stevenson</span><br/>
<span class="celeb"> feat Paul Wesley<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t77-drew-stevenson-ft-paul-wesley" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 3 CORRESPOND A L AVATAR 3 -->
<div id="staff3">
<div class="info_staff">
<span class="nom"> Josh Andrews</span><br/>
<span class="celeb"> feat Joe Jonas<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t75-josh-andrews-ft-joe-jonas" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 4 CORRESPOND A L AVATAR 4 -->
<div id="staff4">
<div class="info_staff">
<span class="nom"> Derek Lucas Cartier</span><br/>
<span class="celeb"> feat Ian Somerhalder<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t74-derek-lucas-cartier-ft-ian-somerhalder" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 5 CORRESPOND A L AVATAR 5 -->
<div id="staff5">
<div class="info_staff">
<span class="nom"> Dorian H. Nicolson</span><br/>
<span class="celeb"> feat Ben Barnes<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t72-dorian-h-nicolson-ft-ben-barnes" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 6 CORRESPOND A L AVATAR 6 -->
<div id="staff6">
<div class="info_staff">
<span class="nom"> Desteny H. Callini</span><br/>
<span class="celeb"> feat Ashley Greene<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t48-desteny-h-callini-ft-ashley-greene" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 7 CORRESPOND A L AVATAR 7 -->
<div id="staff7">
<div class="info_staff">
<span class="nom"> Tyron Miller</span><br/>
<span class="celeb"> feat Alex Meraz<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t71-tyron-miller-ft-alex-meraz" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
<!-- CONTENU 8 CORRESPOND A L AVATAR 8 -->
<div id="staff8">
<div class="info_staff">
<span class="nom"> Tyron Miller</span><br/>
<span class="celeb"> feat Alex Meraz<br/></span>
<span class="groupes"><a href="http://temptationisland.forum.st/t71-tyron-miller-ft-alex-meraz" target="_blank">PV </a>♦ <font color="c9909f">Libre</font></span>
</div></div>
</div>
<!-- FIN DU CONTENU DES ONGLETS (AVATARS) -->
</div>
<!-- FIN CODES STAFF -->
<script type="text/javascript">
function Monter_Cacher(id)
{
for(var i=1;i<=8;i++)
{
document.getElementById('staff'+i).style.display='none';
}
if(document.getElementById(id).style.display =='none')
{
document.getElementById(id).style.display = 'block';
}
}
Monter_Cacher('staff1');
</script> </div>
<br><div style="margin-left:300px;"><div style="background-color:#F8EEE9;-moz-border-radius:10px;font-size:11px;font-family:arial;color:#91776b;width:150px;text-align:justify;"><span class="titree"><div style="margin-left:20px;"><span class="titree"><center>Météo</div></center></span><div style="-moz-border-radius:10px;border-radius:10px;-webkit-border-radius:10px;background-color:#F8EEE9;padding:5px;"><span class="celeb"><div style="text-align:justify;padding-right:5px;">L'été sera chaud, l'été sera beau, c'est le moment idéal pour faire la fête !</div></span>
<center><table><td><img src="http://img4.hostingpics.net/pics/83120420738bubkasunny.png" style="padding-top:10px;padding-bottom:-10px;"></td><td><img src="http://img4.hostingpics.net/pics/16439621724bubkasunglasses.png"></td></table></center></div></div>
</td></tr></table>
</HTML>
Cordialement.
Invité- Invité
Re: Problème HTML
par CryingToYourHeart Mer 27 Juin 2012 - 13:00
Merci c'est exactement ce que je souhaitais 
CryingToYourHeart- ****
-
Messages : 452
Inscrit(e) le : 18/01/2012 -
Sujets similairesForum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum