Sujets similaires

Bonjour,

Suite à un tutoriel que j'ai prise sur ce forum, j'ai eu un petit problème avec la PA. Et sors du cadre de base et ça fait pas top :s Et je sais pas si je dois modifier le CSS ou le HTLM (tuto en question)

Image du problème

Je peux te suggéré une solution très simple et pas trop chiante. Augmenter la largeur de ton forum de quelques pixel. Technique de feignant. XD

J'ai parcouru vaguement le code, si je ne me trompe pas faudrait changer cette valeurs :

Code:: #EnTete {
position:relative;
/* largeur et hauteur de l'image */
[b] [u]width:800px;[/u][/b]
height:500px;
}

Après faut voir si la PA n'est pas déformé, Dans ce cas faudra changer plusieurs propriétés CSS et surement html. Décalage de la PA 2176505670

Aaah j'ai testé la technique du feignant mais rien ne bouge ._. Ensuite j'ai déjà essayé de modifier la valeur que tu m'as dite mais le décalage est encore pire et en plus même en bas, ça remonte : photo pour montrer là je l'ai mit à 750px

Bonjour DisLove'

Ce problème survient parce que la largeur de ta PA est supérieure à la largeur que tu as donné à ton forum (et donc à la page d'accueil)... tu as deux solutions:

Voilà !

DisLove' a écrit:: Aaah j'ai testé la technique du feignant mais rien ne bouge ._.

Pour augmenter la largeur de ton forum, l'as tu fais par CSS ou par le bordel qui ce trouve je ne sais plus trop où dans le forum ? Si tu l'as fais par le truc du forum c'est que tu as déjà un code CSS de ce type là :

Code:: .bodylinewidth {
width: 820px;
}

Trouve le et agrandit le normalement sa devrait marcher. Maintenant si tu trouves ton forum trop grand et grave laid applique la solutions numéros deux.

Voilà mon forum : CLIC

Pour la largeur du fofo j'ai vais via le pourcentage dans la partie configuration du forum mais en voyant le bout de code que tu as dis Undead, je l'ai dans mon CSS & il est à 830 donc normalement ça devrai aller puisque la PA fait 800px à la base. Enfin je suppose.

Essaie ça :

CSS :

Code:: #EnTete {
height: 500px;
position: relative;
width: 780px;
}
#EnTete #Bande {
background-image: url("http://img15.hostingpics.net/pics/776869Bandeau.png");
height: 72px;
left: 119px;
position: absolute;
top: 100px;
width: 531px;
}
.titre2 {
color: #535353;
font-family: Helvetica Neue;
font-size: 24px;
font-weight: bold;
left: 175px;
letter-spacing: -1px;
position: absolute;
text-shadow: 1px 1px 1px #000000;
text-transform: uppercase;
top: 16px;
}
.titre2:hover {
color: #000000;
}
a:link {
cursor: pointer;
}
a, a:hover {
text-decoration: none;
}
.titre {
background-color: #2F3439;
border-bottom: 3px solid #CCCCCC;
border-radius: 10px 10px 40px 40px;
color: #EEEEEE;
font-family: Helvetica Neue;
font-size: 28px;
font-weight: bold;
letter-spacing: -1px;
padding: 5px;
text-align: center;
text-shadow: 1px 2px 1px #C3C3C3;
text-transform: uppercase;
}
.titre:hover {
letter-spacing: 0;
}
.presentation {
background-color: #BA8D3A;
border-radius: 50px 50px 50px 50px;
box-shadow: 0 0 5px #000000;
height: auto;
margin-left: -10px;
margin-right: -4px;
padding: 50px 16px 8px;
width: 420px;
}
.presentation p {
background-color: #FFFFFF;
border-left: 3px solid #996F22;
border-radius: 50px 50px 50px 50px;
border-right: 3px solid #996F22;
color: #666666;
font-family: calibri;
font-size: 13px;
padding: 20px;
text-align: justify;
}
.navigation {
background-color: #996F22;
border-bottom: 2px solid #000000;
border-bottom-left-radius: 30px;
border-top-left-radius: 30px;
font-family: "Courier New",Courier,monospace;
font-size: 12px;
margin-left: 15px;
margin-top: 12px;
padding: 3px;
text-align: center;
text-shadow: 0 0 3px #000000;
text-transform: uppercase;
width: 125px;
}
.navigation:hover {
background-color: #000000;
border-bottom: 2px solid #996F22;
letter-spacing: 1px;
text-shadow: 0 0 3px #FFFFFF;
}
.navigation a {
color: #FFFFFF;
}
.navigation a:hover {
color: #FF6600;
}
.annonces {
background-color: #211F1E;
border-bottom-right-radius: 30px;
border-left: thin solid #000000;
border-top-right-radius: 30px;
box-shadow: 1px 0 4px #000000;
max-height: 185px;
padding-bottom: 8px;
padding-right: 10px;
padding-top: 8px;
text-align: center;
width: 170px;
}
.titre3 {
color: #BA8D3A;
font-family: helvetica neue;
font-size: 19px;
font-weight: bold;
letter-spacing: -1px;
text-align: center;
text-shadow: 2px 2px 1px #996F22;
text-transform: uppercase;
}
.titre3:hover {
color: #AB8846;
letter-spacing: 0;
}
.annonces p {
background-color: #FFFFFF;
border-bottom: 3px solid #33373D;
border-bottom-right-radius: 20px;
border-right: 3px solid #33373D;
border-top-right-radius: 20px;
color: #666666;
font-family: calibri;
font-size: 13px;
padding: 8px;
text-align: justify;
}
.html-marquee {
height: 125px;
}
.html-marquee2 {
height: 31px;
}
.partenaires {
background-color: #313131;
background-image: url("http://img15.hostingpics.net/pics/874614Partenaires.png");
background-position: left center;
background-repeat: no-repeat;
border-radius: 50px 50px 50px 50px;
box-shadow: 0 0 5px #000000;
padding: 1px 10px 1px 250px;
width: 500px;
}
.partenaires p {
background-color: #FFFFFF;
border-bottom: 3px solid #0F0F0F;
border-left: 3px solid #0F0F0F;
border-radius: 20px 20px 20px 20px;
border-right: 3px solid #0F0F0F;
height: 31px;
padding: 6px;
}
.partenaires img {
box-shadow: 0 0 4px #999999;
}
.credits {
color: #B5B5B5;
font-family: calibri;
font-size: 12px;
padding: 10px;
text-align: center;
text-shadow: 0 0 4px #000000;
}
.credits a {
color: #E2007A;
}
.credits a:hover {
color: #EA69A0;
}

HTML :

Code:: <div id="EnTete">
<div style="background-image:url('http://www.hostingpics.net/thumbs/43/02/72/mini_430272brokennoise.png'); border: 8px solid #fff ; border-right:5px #fff solid; width: 780px; height: auto; box-shadow: 0px 0px 6px #666; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;">
<div class="titre">Welcome to Moonlight Valley</div>
<br>
<br>
<div id="Bande">
<span class="titre2">Présentation</span>
</div>
<table style="width:760px;">
<tbody>
<tr>
<td style="width:150px;">
<div class="navigation">
<a href="http://moonlight-valley.forumactif.fr/t2-lois-de-moonlight-valley">Règlement</a>
</div>
<div class="navigation">
<a href="http://moonlight-valley.forumactif.fr/t7-mais-qui-sont-ils">Les groupes</a>
</div>
<div class="navigation">
<a href="http://moonlight-valley.forumactif.fr/t4-bottins-des-stars#4">Bottin des stars</a>
</div>
<div class="navigation">
<a href="http://moonlight-valley.forumactif.fr/f5-postes-vacants">Postes Vacants</a>
</div>
<div class="navigation">
<a href="http://moonlight-valley.forumactif.fr/f4-presentation">Présentation</a>
</div>
<div class="navigation">
<a href="http://moonlight-valley.forumactif.fr/f21-publicites-et-partenariats">Partenariat</a>
</div>
<div class="navigation">
<a href="http://moonlight-valley.forumactif.fr/t61-top-sites#320">TOP SITES</a>
</div>
</td>
<td style="width:430px;">
<div class="presentation">
<p>
<br>
15 Janvier 2012. La nouvelle a l'effet d'une bombe. Les vampires, ils sont là ! Ils existent ! Naïfs que nous sommes, nous pensions qu'ils n'étaient que les protagonistes de romans pseudo-érotiques pour jeune fille, alors que ces créatures assoiffées de sang vivaient à nos côtés, à l'insu de tous, depuis bien longtemps, peut-être bien depuis toujours, attendant leur heure. Mais peut-être étions trop aveugles pour observer les signes de leur présence tout simplement. Tout ses meurtres non-élucidés, ou ses soi-disant attaques sanglantes d'animaux sauvages prenaient tout leur sens à présent [...]
<br>
<br>
La face du monde a changé. Bien plus cruelle, bien plus sombre. La rumeur de la guerre se répand un peu partout. La survie est dorénavant le premier des enjeux. Dans quel camp serez-vous ?
<a class="postlink" rel="nofollow" target="_blank" href="http://moonlight-valley.forumactif.fr/t1-contexte-du-forum">Lire la suite</a>
<br>
</p>
</div>
</td>
<td style="width:180px">
<p> </p>
<div class="annonces">
<span class="titre3">Annonces</span>
<p>
<marquee class="html-marquee" onmouseout="this.start();" onmouseover="this.stop();" scrollamount="2" direction="up">
➜ 14/04/12 : Ouverture du forum
<br>
<br>
➜ 03/06/12 : Modification du règlement
<br>
<br>
</marquee>
</p>
</div>
</td>
</tr>
</tbody>
</table>
<br>
<center>
<div class="partenaires">
<p>
<marquee class="html-marquee2" onmouseout="this.start();" onmouseover="this.stop();" scrollamount="3" direction="left">
<a target="_blank" href="http://graph-forum.forumactif.com">
<img src="http://img15.hostingpics.net/pics/8685298831.png">
</a>
</marquee>
</p>
</div>
</center>
<div class="credits">
Codage by
<a target="_blank" href="http://graph-forum.forumactif.com">
<b>mimizZ</b>
</a>
| Tous droits réservés
</div>
</div>
</div>

Ca me fait ça now :s Sincèrement je suis désolée de vous embêter avec ça ^^"

Spoiler:

Was esch des...

Je suis entrain de phasé d'une puissance sans nom tu n'imagines même pas. Je commence a devenir débile. XDDD
Effectivement j'ai mis la pa sur un forum complétement vierge et sa foire. Ce qui veux dire que j'ai foiré quelques chose sur mon forum test. ScheiBe sa m'apprendra a me fier a ce que je vois. e_e
Si personne ne poste a la suite je regarderais demain je supprimerais le poste pour reposter. e_e

edit :

Code:: #EnTete {
position:relative;
width:780px;
height:600px;
}

Remplace ton ancien #En_Tete par ça je ne pense pas que ça change grand chose mais la hauteur serra au moins juste. J'ai modifier la largeur mais pas la hauteur. Je deviens vraiment débile. XDDDD

DisLove' essaye d'ajouter ce code CSS

Code:: #EnTete{
height: inherit !important;
width: inherit !important;
}

Undead : C'est presque ça ton code ! Mais après il y a espace du côté gauche.D'ailleurs s'il y serait pas la PA serait nickel =_=

Iowan : Je t'aime t'as réussi à réparer mon problème ;w;

Sauf que...Le ruban avec "Présentation" se retrouve en plein milieu de ma bannière MDR *se flingue avec cette PA XD*