Fond sur page d'accueil

[AloysiaM]

Bonjour à tous !

Je m'en viens vers vous aujourd'hui car malgré les nombreux tuto que j'ai pu lire jusqu'à présent je n'arrive pas au résultat suivant : Tout simplement je souhaiterai mettre une image en fond sur ma page d'accueil. Le problème, est que les tableaux déjà créés, plutôt que de se mettre sur cette image de fond, descendent sous mon image comme ceci :

Spoiler:

Ce que je souhaiterai, c'est voir l'image de fond remplir totalement le cadre de la page d'accueil, et que les tableaux garde leur position initiale mais sur l'image et non en dessous.

Pour vous aidez, voici le détail de la partie du CSS concernant le problème

Code:

Page d'Accueil
.Cueil {
  border: 2px solid #cfcfcf;
  border-top: 1px solid #cfcfcf;
  border-bottom: 1px solid #cfcfcf;
  border-radius: 25px; 
  padding-top:15px;
  padding-bottom:15px;
}

.kouik {
  border-radius: 30px 30px 0px 0px;
  width: 754px;
  height: 675px;
  div.newslink
  background-image: url('http://illiweb.com/fa/pbucket.gif');
  background-repeat: no-repeat;
  }
.palinks:hover {
  color: #775d76;
  text-shadow: 0px 0px 2px #775d76;

Et la partie HTML

Code:

<center><div class="kouik" style="background-image: url('http://illiweb.com/fa/pbucket.gif');background-repeat: no-repeat; width: 721px; height: 450px"></div></center>

<table border=0 style="width:821px; margin-top: -20px;"><tr><td colspan=7><center></div></center></td></tr><br><br>

Je vous remercie d'avance pour vos réponses ! ♥

[Anzu]

Bonjour et Bienvenue sur le Forum des Forums ForumActif Vu que vous êtes nouveau, voici quelques sujets importants : Sécurité : Mail de fondation - Ce qu'il ne faut pas faire Listing - Questions/Réponses fréquentes Listing - Trucs et astuces La fonction Rechercher La FAQ de Forumactif.com N'hésitez pas à ouvrir un nouveau sujet si vous ne trouvez pas votre réponse

Bonsoir,

Il suffit de placer votre image dans le table en fond tout simplement

Code:

<table style="background-image: url('http://illiweb.com/fa/pbucket.gif');

Cordialement.

[AloysiaM]

Re-bonsoir,

Tout d'abord merci infiniment pour votre réponse efficace =DD Cependant, le résultat n'est pas vraiment celui que j'imaginais. Savez-vous comment je pourrai faire, ou quelles fonction toucher pour que mon image apparaisse comme dans celle-ci ? =)

Spoiler:

Si ce n'est pas le cas ce n'est pas grave j'essaierai de me débrouiller ^^
Merci encore !

[Anzu]

Pourrais-je avoir le reste du code de votre page d'accueil ? Dans votre premier message, il n'y a que le début

Cordialement.

[AloysiaM]

Oui bien sûr, le voilà ^^

Code:

<center><div class="kouik" style="background-image: url('http://illiweb.com/fa/pbucket.gif');"></div></center>

<table border=0 style="width:821px; margin-top: -20px;"><tr><td colspan=7><center></div></center></td></tr><br><br>
<tr><td><div class="element2"><center><span class="element2titre">Actualités</span></center><div class="element2kadre"><marquee direction="up"; scrollamount="1";  width="220px";  height="65px";>• 25/02/2013 : l'Event "Festival de la paix" est toujours en cours. Consultez régulièrement l'update pour vous tenir informez de son déroulement>.<br><br>
• Le staff d'Aparecium dit "au revoir" à Alec et Phoebe. Nous leur souhaitons une bonne continuation ! ♥ <td colspan="2"><div class="element3"><center><span class="element3titre">Bienvenue sur APARECIUM !</span></center><div class="element3kadre"><div style="height: 100px; overflow:auto"><strong>Août 2000.</strong> Depuis maintenant deux ans, les trois quarts des membres de l'Ordre des Ténèbres ont été coincés et mis à Azkaban. Le quart restant? Ils ont réussi à fuir, à se cacher dans des lieux plus insolites. Certains sont partis seuls pour être certains de conserver leur sécurité, d'autres sont partis avec leur progéniture et d'autres avec l'ensemble de leur famille, ne voulant pas se séparer d'eux. Concernant ceux qui sont restés à Azkaban, certains ont reçu le baiser du détraqueur. D'autres, plus chanceux, ont simplement vécu dans la peur de le subir à un moment ou à un autre. Une chose est certaine, tout est redevenu calme dans le monde magique. La question que tout le monde se pose<br>
<a href="http://apareciumreturn.harrypotterrpg.fr/t437-o-pour-savoir-de-quoi-on-parle">En savoir plus</a></div></div></div></td></tr>

<tr><td><div class="element4"><center><span class="element4titre">Scénarios vacants</span></center><div class="element4kadre"><center><table>
<td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t18-o-personnel-de-l-institut" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Takeshi Yamamoto</strong><br>ft. Kazuki Kato<br><br>
<strong>Groupe : <font color="#AD1010">Personnel</font></strong><br>
<i>Prof Théâtre/Comédie</i></center></span></div></td>
<td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t20-o-les-etoiles-de-tenno" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>San Minh</strong><br>ft. Se Kyung Shin<br><br>
<strong>Groupe : <font color="#14091C">Étoiles</font></strong><br>
<i>Violoniste</i></center></span></div></td>
<td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t27-o-chanteurs-cantatrices-4-4" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Hatori Ôta</strong><br>ft. Aaron Yan<br><br>
<strong>Groupe : <font color="#E08B0B">Sing Dept</font></strong><br>
<i>Option Danse - 3e année</i></center></span></div></td>
</tr>
<tr>
<td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t26-o-danseurs-ballerines-1-4" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Amy Muñoz</strong><br>ft. Charice<br><br>
<strong>Groupe : <font color="#E00B41">Dance Dept</font></strong><br>
<i>Option Générale - 1e année</i></center></span></div></td>
<td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t25-o-acteurs-comediens-4-4" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Sorata Muroi</strong><br>ft. Koji Seto<br><br>
<strong>Groupe : <font color="#5EB326">Theatre Dept</font></strong><br>
<i>3e année</i></center></span></div></td>
<td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t19-o-musiciens-chefs-d-orchestres-4-4" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Shin Murakami</strong><br>ft. Haruma Miura<br><br>
<strong>Groupe : <font color="#2686B3">Music Dept</font></strong><br>
<i>Piano - 3e année</i></center></span></div></td>
</div></tr></table></center></div></div></td>

<td><div class="element5"><center><span class="element5titre">Le Staff</span></center><div class="element5kadre"><center><table><td><div class="info2" href="#"><img src="http://illiweb.com/fa/pbucket.gif"><span><center><strong>Athénaïs L. Pontius</strong><br>
Admin Fondatrice<br><br>
<a href="http://apareciumreturn.harrypotterrpg.fr/u3" class="postlink" target="_blank" rel="nofollow">Profil</a> - <a href="http://apareciumreturn.harrypotterrpg.fr/privmsg?mode=post&u=3" class="postlink" target="_blank" rel="nofollow">Envoyer un MP</a></center></span></div></td><td><div class="info2" href="#"><img src="http://illiweb.com/fa/pbucket.gif"><span><center><strong>Alan M. Davis</strong><br>
Admin à tout faire
<br>DC : Jolane C. Everdeen<br>
<a href="http://apareciumreturn.harrypotterrpg.fr/u51"_blank" rel="nofollow">Profil</a> - <a href="http://apareciumreturn.harrypotterrpg.fr/privmsg?mode=post&u=51" class="postlink" target="_blank" rel="nofollow">Envoyer un MP</a></center></span></div></td><td><div class="info2" href="#"><img src="http://illiweb.com/fa/pbucket.gif"><span><center><strong>Andrew J. Collins</strong><br>
Admin dévoué aux membres<br>
DC : Caleb I. Jenkins<br>
<a href="http://apareciumreturn.harrypotterrpg.fr/u19"_blank" rel="nofollow">Profil</a> - <a href="http://apareciumreturn.harrypotterrpg.fr/privmsg?mode=post&u=19" class="postlink" target="_blank" rel="nofollow">Envoyer un MP</a></center></span></div></td></table></center></div></div></center></td>

<td><div class="element6"><center><span class="element6titre">Membre du mois !</span></center><div class="element6kadre"><center> <br><br>
</center></div></div></td></tr>

<tr><td colspan=7><center><div class="element7">Ce forum a été fondé par ©Aloysia Miller, toute reproduction totale ou partielle est strictement interdite. Le design et le CSS ont été réalisés par ©SeongHae.
Ce forum est optimisé pour Mozilla Firefox.<br>Pour ceux qui n'ont pas Windows 7 et ne possède pas la font Gabriola : téléchargez-la pour voir le forum sans déformation : <a href="http://www.fontineed.com/font/gabriola_download" class="postlink" target="_blank" rel="nofollow">>>ici<<</a>
</div></center></td></tr></table>

[Anzu]

Le résultat n'était pas le bon car vous avez sans doute mal procédé.

Remplacez le code de votre PA par:

Code:

       
        <table style="background-image: url('http://illiweb.com/fa/pbucket.gif');background-repeat: no-repeat; width: 721px; height: 450px; padding-top: 200px;"><br><br>


  <tr><td colspan=7><center></div></center></td></tr><br><br>
    <tr><td><div class="element2"><center><span class="element2titre">Actualités</span></center><div class="element2kadre"><marquee direction="up"; scrollamount="1";  width="220px";  height="65px";>• 25/02/2013 : l'Event "Festival de la paix" est toujours en cours. Consultez régulièrement l'update pour vous tenir informez de son déroulement>.<br><br>
    • Le staff d'Aparecium dit "au revoir" à Alec et Phoebe. Nous leur souhaitons une bonne continuation ! ♥ <td colspan="2"><div class="element3"><center><span class="element3titre">Bienvenue sur APARECIUM !</span></center><div class="element3kadre"><div style="height: 100px; overflow:auto"><strong>Août 2000.</strong> Depuis maintenant deux ans, les trois quarts des membres de l'Ordre des Ténèbres ont été coincés et mis à Azkaban. Le quart restant? Ils ont réussi à fuir, à se cacher dans des lieux plus insolites. Certains sont partis seuls pour être certains de conserver leur sécurité, d'autres sont partis avec leur progéniture et d'autres avec l'ensemble de leur famille, ne voulant pas se séparer d'eux. Concernant ceux qui sont restés à Azkaban, certains ont reçu le baiser du détraqueur. D'autres, plus chanceux, ont simplement vécu dans la peur de le subir à un moment ou à un autre. Une chose est certaine, tout est redevenu calme dans le monde magique. La question que tout le monde se pose<br>
    <a href="http://apareciumreturn.harrypotterrpg.fr/t437-o-pour-savoir-de-quoi-on-parle">En savoir plus</a></div></div></div></td></tr>

    <tr><td><div class="element4"><center><span class="element4titre">Scénarios vacants</span></center><div class="element4kadre"><center><table>
    <td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t18-o-personnel-de-l-institut" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Takeshi Yamamoto</strong><br>ft. Kazuki Kato<br><br>
    <strong>Groupe : <font color="#AD1010">Personnel</font></strong><br>
    <i>Prof Théâtre/Comédie</i></center></span></div></td>
    <td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t20-o-les-etoiles-de-tenno" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>San Minh</strong><br>ft. Se Kyung Shin<br><br>
    <strong>Groupe : <font color="#14091C">Étoiles</font></strong><br>
    <i>Violoniste</i></center></span></div></td>
    <td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t27-o-chanteurs-cantatrices-4-4" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Hatori Ôta</strong><br>ft. Aaron Yan<br><br>
    <strong>Groupe : <font color="#E08B0B">Sing Dept</font></strong><br>
    <i>Option Danse - 3e année</i></center></span></div></td>
    </tr>
    <tr>
    <td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t26-o-danseurs-ballerines-1-4" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Amy Muñoz</strong><br>ft. Charice<br><br>
    <strong>Groupe : <font color="#E00B41">Dance Dept</font></strong><br>
    <i>Option Générale - 1e année</i></center></span></div></td>
    <td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t25-o-acteurs-comediens-4-4" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Sorata Muroi</strong><br>ft. Koji Seto<br><br>
    <strong>Groupe : <font color="#5EB326">Theatre Dept</font></strong><br>
    <i>3e année</i></center></span></div></td>
    <td><div class="info" href="#"><a href="http://institut-tenno.forumgratuit.org/t19-o-musiciens-chefs-d-orchestres-4-4" class="postlink" target="_blank" rel="nofollow"><img src="http://illiweb.com/fa/pbucket.gif"></a><span><center><strong>Shin Murakami</strong><br>ft. Haruma Miura<br><br>
    <strong>Groupe : <font color="#2686B3">Music Dept</font></strong><br>
    <i>Piano - 3e année</i></center></span></div></td>
    </div></tr></table></center></div></div></td>

    <td><div class="element5"><center><span class="element5titre">Le Staff</span></center><div class="element5kadre"><center><table><td><div class="info2" href="#"><img src="http://illiweb.com/fa/pbucket.gif"><span><center><strong>Athénaïs L. Pontius</strong><br>
    Admin Fondatrice<br><br>
    <a href="http://apareciumreturn.harrypotterrpg.fr/u3" class="postlink" target="_blank" rel="nofollow">Profil</a> - <a href="http://apareciumreturn.harrypotterrpg.fr/privmsg?mode=post&u=3" class="postlink" target="_blank" rel="nofollow">Envoyer un MP</a></center></span></div></td><td><div class="info2" href="#"><img src="http://illiweb.com/fa/pbucket.gif"><span><center><strong>Alan M. Davis</strong><br>
    Admin à tout faire
    <br>DC : Jolane C. Everdeen<br>
    <a href="http://apareciumreturn.harrypotterrpg.fr/u51"_blank" rel="nofollow">Profil</a> - <a href="http://apareciumreturn.harrypotterrpg.fr/privmsg?mode=post&u=51" class="postlink" target="_blank" rel="nofollow">Envoyer un MP</a></center></span></div></td><td><div class="info2" href="#"><img src="http://illiweb.com/fa/pbucket.gif"><span><center><strong>Andrew J. Collins</strong><br>
    Admin dévoué aux membres<br>
    DC : Caleb I. Jenkins<br>
    <a href="http://apareciumreturn.harrypotterrpg.fr/u19"_blank" rel="nofollow">Profil</a> - <a href="http://apareciumreturn.harrypotterrpg.fr/privmsg?mode=post&u=19" class="postlink" target="_blank" rel="nofollow">Envoyer un MP</a></center></span></div></td></table></center></div></div></center></td>

    <td><div class="element6"><center><span class="element6titre">Membre du mois !</span></center><div class="element6kadre"><center> <br><br>
    </center></div></div></td></tr>

    <tr><td colspan=7><center><div class="element7">Ce forum a été fondé par ©Aloysia Miller, toute reproduction totale ou partielle est strictement interdite. Le design et le CSS ont été réalisés par ©SeongHae.
    Ce forum est optimisé pour Mozilla Firefox.<br>Pour ceux qui n'ont pas Windows 7 et ne possède pas la font Gabriola : téléchargez-la pour voir le forum sans déformation : <a href="http://www.fontineed.com/font/gabriola_download" class="postlink" target="_blank" rel="nofollow">>>ici<<</a>
    </div></center></td></tr></table>

Pour placer le contenu en dessous du titre, j'ai mis un padding top dans le table avec l'image.

Cordialement.

[AloysiaM]

D'accord, merci beaucoup est le résultat est superbe ! ^o^ ♥