Page d'accueil "Extensible"

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

Résolu Page d'accueil "Extensible"

Message par Chekchie le Ven 11 Jan 2013 - 1:37

Bonjour,

Alors je pose beaucoup de questions ici et la dernière fois je n'ai pas répondu après 7 jours, je m'en excuse la période du Nouvel An m'a fait voyager et j'ai envoyé un MP à la personne m'ayant répondu pour la remercier =X

Tout d'abord, voici ma page d'accueil de forum:
Code:
<!doctype html>
<html>
<head>
  <meta charset="UTF-8">      
  <title>Fond extensible - version CSS</title>
  <link rel="stylesheet" href="style.css" type="text/css" media="screen"/>      
</head>
<body>
<table style="margin:auto;" align="center" width="100%" height="100%">
 <tr>
<td colspan="3"><div style="text-align:center;font:24px georgia;color:black">{ ~<i>Bienvenue {USER&amp;#8288;NAME}</i>~ }
      </div>
    </td>
  </tr>
  <tr>
    <td>
<center><table border="0"><tr><td valign="middle" background="http://img11.hostingpics.net/pics/604403fond1.png" width="320" height="270"><img src="http://img11.hostingpics.net/pics/601962news.png"><MARQUEE width="320" height="270" direction="up" behaviour="scroll" loop="infinite" onmouseover="this.setAttribute('scrollamount', 2, 0);" onmouseout="this.setAttribute('scrollamount', 4, 0);"><center><br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t167-a-la-une-de-rune-midgard-le-jeune-capitaine-retrouve-mort?tid=f7c0ce2df731a31d135c87b8a32a9678" class="postlink">¤ UN MORT TROUVÉ À PRONTERA ¤</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t7-les-races-et-etats#10?tid=4ab8f643d8b70bef135c87b8a32a9678" class="postlink">¤ Ajouts sur les races pures! (pas modifications, mais bien ajouts! : ) ) ¤</a>
<br>
<br>
¤ Rafraîchissement visuel... au sens littéral ¤
<br>
<br>
¤ N'hésitez jamais au grand jamais à nous poser des questions ou demander nos identifiants Skype, le staff est là pour vous! ¤
<br>
<br>
¤ Certains ne semblent pas l'avoir remarqué, mais vous avez dans votre<strong> profil </strong>une case pour mettre le lien de votre fiche x) ¤</center></MARQUEE></td>

<td valign="middle" width="436"><a href="http://redemptionrp.forums-actifs.com/u1"><img src="http://img11.hostingpics.net/pics/580254schif.png"></a><a href="http://redemptionrp.forums-actifs.com/u2"><img src="http://img11.hostingpics.net/pics/648599chek.png"></a><a href="http://redemptionrp.forums-actifs.com/u3"><img src="http://img11.hostingpics.net/pics/950127lyon.png"></a><a href="http://redemptionrp.forums-actifs.com/u23?tid=a903c0d278bd7094cc6dc7c882daba8a" class="postlink"><img src="http://img11.hostingpics.net/pics/822413arslan.png"></a></td>

<td valign="middle" background="http://img11.hostingpics.net/pics/525245fond2.png" width="340" height="400p"><center><img src="http://img11.hostingpics.net/pics/495625lien.png">
<a href="http://redemptionrp.forums-actifs.com/t66-pourquoi-choisir-redemption">POURQUOI NOUS CHOISIR?</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t2-reglements-important">LES RÈGLES</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t25-les-donations">LES DONATIONS</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t6-liste-du-staff">LE MOT DU STAFF</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t18-personnages-predefinis">PERSONNAGES PRÉDÉFINIS</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t106-compilation-des-joueurs-et-restrictions">COMPILATION DES JOUEURS</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t64-a-propos-des-evenements#433">LES "EVENTS"</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/f6-la-place-des-guildes">LES GUILDES</a></center></td>

</tr></table></center></div>
    </td>
  </tr>
</table><br /></p></body>
</html>

http://redemptionrp.forums-actifs.com/

J'ai bien tenté de bidouiller par moi-même plusieurs trucs, mais malheureusement je n'y arrive pas: la page d'accueil ne veut pas s'adapter à toute résolution. Ayant 2 "backgrounds" dans différentes cellules de mon tableau imaginaire, je ne sais trop que faire. De plus, dans la cellule du milieu, 4 images sont collées pour en former une et lors des problèmes de résolutions, elles apparaissent une par-dessus l'autre (c'est-à-dire alignées à la verticale), ce que je ne voudrais pas. J'aimerais que s'il y ait un problème de résolution, les images se rapetissent et restent en place si possible, sinon je m'arrangerai en ne mettant qu'une image au centre.

Afin de ne pas vous harceler avec tout cela, j'aimerais beaucoup que vous m'expliquiez les codes ajoutés/supprimés/remplacés pour que je ne refasse pas les mêmes erreurs s'il vous plaît... T-T

Merci infiniment!
Emilie alias "Chekchie"


Dernière édition par Chekchie le Ven 11 Jan 2013 - 17:25, édité 3 fois

Chekchie
Nouveau membre

Féminin
Messages : 19
Inscrit(e) le : 09/09/2011

http://redemptionrp.forums-actifs.com/
Chekchie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueil "Extensible"

Message par Roxy. le Ven 11 Jan 2013 - 12:58

Bonjour,
Déjà je rencontre un petit soucis :
Vous avez deux tables. Une seule, c'est amplement suffisant !

Remplacez donc le table de cette balise :
Code:
<table style="margin:auto;" align="center" width="100%" height="100%">
par div.
Juste en dessous vous avez :
Code:
 <tr>
<td colspan="3">
    </td>
  </tr>
  <tr>
    <td>

Qui entoure le USERNAME. Supprimez ce bout de code.
Maintenant, tout en bas du code, à la deuxième balise :
Code:
</table>
Vous allez aussi remplacer le table par div.
Et juste au dessus, supprimez :
Code:
    </td>
  </tr>

Par contre à la fin, vous avez une deuxième
Code:
 </div>
qui traine. Supprimez la.

Pour avoir un code encore plus propre, pas besoin de créez une page de A à Z.
Recherchez ces deux codes et supprimez les :

Code:
</body>
</html>
&
Code:
<!doctype html>
<html>
<head>
  <meta charset="UTF-8">     
  <title>Fond extensible - version CSS</title>
  <link rel="stylesheet" href="style.css" type="text/css" media="screen"/>     
</head>
<body>

Cordialement,

Roxy.
# Tropactif #

Féminin
Messages : 1058
Inscrit(e) le : 24/07/2011

http://roxy-test.forumgratuit.org/
Roxy. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueil "Extensible"

Message par Scoubifitz le Ven 11 Jan 2013 - 13:09

bonjour,

en complément de ce qui a été dit plus haut ...

une solution serait de donner une largeur en pourcent (%) à chaque image , avec un maximum autorisé si la résolution est élevée .

Repérez cette cellule :
Code:
<td valign="middle" width="436"><a href="http://redemptionrp.forums-actifs.com/u1"><img src="http://img11.hostingpics.net/pics/580254schif.png"></a><a href="http://redemptionrp.forums-actifs.com/u2"><img src="http://img11.hostingpics.net/pics/648599chek.png"></a><a href="http://redemptionrp.forums-actifs.com/u3"><img src="http://img11.hostingpics.net/pics/950127lyon.png"></a><a href="http://redemptionrp.forums-actifs.com/u23?tid=a903c0d278bd7094cc6dc7c882daba8a" class="postlink"><img src="http://img11.hostingpics.net/pics/822413arslan.png"></a></td>

et remplacez par :
Code:
<td valign="middle" width="436"><a href="http://redemptionrp.forums-actifs.com/u1"><img src="http://img11.hostingpics.net/pics/580254schif.png" style="width:24%;max-width:105px;"></a><a href="http://redemptionrp.forums-actifs.com/u2"><img src="http://img11.hostingpics.net/pics/648599chek.png" style="width:24%;max-width:105px;"></a><a href="http://redemptionrp.forums-actifs.com/u3"><img src="http://img11.hostingpics.net/pics/950127lyon.png" style="width:24%;max-width:105px;"></a><a href="http://redemptionrp.forums-actifs.com/u23" class="postlink"><img src="http://img11.hostingpics.net/pics/822413arslan.png" style="width:24%;max-width:105px;"></a></td>

Évitez aussi de mettre vos identifiants de cession dans les liens :

http://forum.forumactif.com/t12987-securite-ce-qu-il-ne-faut-jamais-faire

Bonne année ! Hi

Scoubifitz
+ Hyperactif +

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

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

Résolu Re: Page d'accueil "Extensible"

Message par FANCH 56 le Ven 11 Jan 2013 - 13:25

Bonjour

Pour ma part, j'ai fais comme ci-dessous (auto) et je n'ai aucun problème


FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueil "Extensible"

Message par Chekchie le Ven 11 Jan 2013 - 17:02

Ouhlàlà! J'arrive et je ne vois que des coeurs généreux T-T Vous savez que vous me sauvez la vie?

Merci infiniment à Roxy pour avoir réussi à déchiffrer mon horrible fouillis !

Un grand merci à Scoubifitz pour m'avoir fait découvrir cette balise magique que je cherchais tant !

Merci beaucoup à FANCH 56 pour ce petit tour de passe-passe qui sera sûrement très utile ! Wink

EDIT: Désolé du dérangement encore...

La page d'accueil semble être décalée vers la gauche maintenant, malheureusement. Un "align="center"" ne semble pas arranger les choses =X
Code:
<table style="margin:auto;" align="center" width="100%" height="100%">
 <tr><div style="text-align:center;font:24px georgia;color:black">{ ~<i>Bienvenue {USER&amp;#8288;NAME}</i>~ }
      </div>

<center><table border="0"><tr><td valign="middle" background="http://img11.hostingpics.net/pics/604403fond1.png" width="320" height="270"><img src="http://img11.hostingpics.net/pics/601962news.png"><MARQUEE width="320" height="270" direction="up" behaviour="scroll" loop="infinite" onmouseover="this.setAttribute('scrollamount', 2, 0);" onmouseout="this.setAttribute('scrollamount', 4, 0);"><center><br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t167-a-la-une-de-rune-midgard-le-jeune-capitaine-retrouve-mort?tid=f7c0ce2df731a31d135c87b8a32a9678" class="postlink">¤ UN MORT TROUVÉ À PRONTERA ¤</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t7-les-races-et-etats#10?tid=4ab8f643d8b70bef135c87b8a32a9678" class="postlink">¤ Ajouts sur les races pures! (pas modifications, mais bien ajouts! : ) ) ¤</a>
<br>
<br>
¤ Rafraîchissement visuel... au sens littéral ¤
<br>
<br>
¤ N'hésitez jamais au grand jamais à nous poser des questions ou demander nos identifiants Skype, le staff est là pour vous! ¤
<br>
<br>
¤ Certains ne semblent pas l'avoir remarqué, mais vous avez dans votre<strong> profil </strong>une case pour mettre le lien de votre fiche x) ¤</center></MARQUEE></td>

        <td valign="middle" width="436"><a href="http://redemptionrp.forums-actifs.com/u1"><img src="http://img11.hostingpics.net/pics/580254schif.png" style="width:24%;max-width:105px;"></a><a href="http://redemptionrp.forums-actifs.com/u2"><img src="http://img11.hostingpics.net/pics/648599chek.png" style="width:24%;max-width:105px;"></a><a href="http://redemptionrp.forums-actifs.com/u3"><img src="http://img11.hostingpics.net/pics/950127lyon.png" style="width:24%;max-width:105px;"></a><a href="http://redemptionrp.forums-actifs.com/u23" class="postlink"><img src="http://img11.hostingpics.net/pics/822413arslan.png" style="width:24%;max-width:105px;"></a></td>

<td valign="middle" background="http://img11.hostingpics.net/pics/525245fond2.png" width="340" height="400p"><center><img src="http://img11.hostingpics.net/pics/495625lien.png">
<a href="http://redemptionrp.forums-actifs.com/t66-pourquoi-choisir-redemption">POURQUOI NOUS CHOISIR?</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t2-reglements-important">LES RÈGLES</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t25-les-donations">LES DONATIONS</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t6-liste-du-staff">LE MOT DU STAFF</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t18-personnages-predefinis">PERSONNAGES PRÉDÉFINIS</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t106-compilation-des-joueurs-et-restrictions">COMPILATION DES JOUEURS</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/t64-a-propos-des-evenements#433">LES "EVENTS"</a>
<br>
<br>
<a href="http://redemptionrp.forums-actifs.com/f6-la-place-des-guildes">LES GUILDES</a></center></td>

</tr></table></center>

</div><br /></p>

Chekchie
Nouveau membre

Féminin
Messages : 19
Inscrit(e) le : 09/09/2011

http://redemptionrp.forums-actifs.com/
Chekchie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueil "Extensible"

Message par Roxy. le Ven 11 Jan 2013 - 17:19

Dernière chose que j'avais négligé.
Tout en bas de votre code, supprimez :
Code:
</p>

Sinon pour le center, déjà vous pouvez supprimez :
Code:
style="margin:auto;"align="center"
Dans la balise table.
Essayez en englobant le tout de :
Code:
<center></center>

Cordialement,

Roxy.
# Tropactif #

Féminin
Messages : 1058
Inscrit(e) le : 24/07/2011

http://roxy-test.forumgratuit.org/
Roxy. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueil "Extensible"

Message par Chekchie le Ven 11 Jan 2013 - 17:24

Merci, cela fonctionne! Very Happy

Problème résolu ~

Bonne journée!

Chekchie
Nouveau membre

Féminin
Messages : 19
Inscrit(e) le : 09/09/2011

http://redemptionrp.forums-actifs.com/
Chekchie a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum