Probleme avec la pa

[Little_dragon]

salut http://blackbuttler.forum-canada.com   Juste un problème pour le coter du contexte l'écriture est par dessus le titre du contexte je me demande comment je peux faire pour le descendre mettre dans le centre du carrer merci beaucoup d'avance pour votre aide si vous avez besoin d'un code ou autre juste me faire signe


edit : j'ai réalisé un autre problème concernant la pa j'ai refais un fond d'image mais sur le carrer des news et autres les écritures n'apparaît pas je vous donne donc les codes ce qui serait plus utiles je crois


voila le css

Code:

body {

    background-position: top center;
}
table.forumline {
    border: 1px dotted;
}
a:hover {
    text-transform: uppercase;
}
a:hover, a:link {
    text-decoration: none !important;
}
.bodylinewidth {
    width: 990px;
    margin: auto;
    margin-top: 380px;
}
a.mainmenu {
    text-decoration: none;
    color: #9A4054;
    font-size: 22px;
    font-family: Brush Script MT;
    text-shadow: 0 0 0 #B9AF96;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
a.mainmenu:hover {
    text-decoration: none;
    color: #D4474D;
    text-shadow: 0 2px 2px #EBEAE6;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.bodyline {
    padding: 0;
}
.forumline {
    border-top: 5px solid #EADBDD;
    border-bottom: 5px solid #EADBDD;
}

.cate_titre {
    clear: both;
    height: 100px;
    margin-top: 50px;
}
.catetitre_bloc {
    position: relative;
    z-index: 1;
    display: block;
    width: 90%;
    height: 20px;
    margin-left: auto;
    margin-right: auto;
    background-color: #a8a8a8;
    transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    -htm-transform: rotate(5deg);
}
.catetitre_content {
    position: absolute;
    z-index: 2;
    display: block;
    width: 950px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -40px;
    text-align: center;
    padding: 2px;
    border-bottom: 3px dotted #191817;
}
.catetitre {
    color: #454545;
    font-family: arial;
    font-size: 26px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 1px 1px 0 #000;
}
.forum_bloc {
    width: 950px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -30px;
}
.forum {
    float: left;
    width: 460px;
    height: 250px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 50px;
}
a.forumlink {
    position: relative;
    z-index: 2;
    width: 100%;
    color: #454545;
    text-align: center;
    font-weight: 700;
    text-transform: uppercase;
    text-shadow: 1px 1px 0 #000;
}
.forum_contenu {
    position: relative;
    z-index: 1;
    width: 98%;
    height: 90%;
    padding: 4px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -8px;
    background-color: #d9d9d9;
    border-left: 1px dotted #191817;
    border-right: 1px dotted #191817;
    border-bottom: 1px dotted #191817;
    border-top: 5px solid #191817;
}
.description {
    display: block;
    width: 400px;
    margin: auto;
    height: 100px;
    overflow: hidden;
    border: 2px solid #9c9c9c;
    box-shadow: 1px 1px 1px #191817;
    -moz-box-shadow: 1px 1px 1px #191817;
    -htm-box-shadow: 1px 1px 1px #191817;
    -webkit-box-shadow: 1px 1px 1px #191817;
    -o-box-shadow: 1px 1px 1px #191817;
}
.description_contenu {
    position: absolute;
    display: block;
    width: 391px;
    height: 91px;
    overflow: auto;
    background-color: #191817;
    font-size: 10px;
    color: #9c9c9c;
    text-align: justify;
    padding: 5px;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.description_contenu:hover {
    opacity: .8;
    -moz-opacity: .8;
    -khtml-opacity: .8;
    filter: alpha(opacity=80);
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.icone_stats {
    width: 300px;
    margin: auto;
    margin-top: -30px;
}
.stats_lastpost {
    display: block;
    width: 160px;
    height: 80px;
    margin-left: 10px;
    background-color: #c8c8c8;
    border: 1px solid #b5b5b5;
    padding: 5px;
    text-align: center;
}
.stats {
    display: block;
    margin-bottom: 5px;
    border-bottom: 1px dotted #b5b5b5;
    padding-bottom: 5px;
    font-size: 10px;
    color: #8f8f8f;
}
.lastpost {
    display: block;
    font-size: 11px;
}
.sforum {
    position: relative;
    z-index: 3;
    display: block;
    height: 0;
    background: #191817;
    color: #b5b5b5;
    overflow: hidden;
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.ouverture_sousforum {
    position: relative;
    z-index: 3;
    display: block;
    float: right;
    width: 120px;
    margin-right: 20px;
    background: #191817;
    color: #b5b5b5;
    font-size: 11px;
    text-align: center;
    padding: 4px;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}
.sous_forum:hover .sforum {
    height: 50px;
    background: #191817;
    color: #b5b5b5;
    padding: 4px;
    overflow: auto;
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.sous_forum a {
    color: #b5b5b5 !important;
    text-shadow: 1px 1px 0 #000;
}
.sous_forum a:hover {
    color: #fff !important;
}
a {
    color: #D6AA45;
    text-decoration: none;
}
A:active, A:link, A:visited {
    text-decoration: none;
    outline: 0;
}
a:hover {
    text-decoration: none !important;
    outline: 0;
    color: #A9CC3F;
}
.postbody I {
    color: #89bab4;
    letter-spacing: 1px;
    text-shadow: #FFF 1px 1px 0;
}
U {
    border-bottom: 1px solid;
    text-decoration: none;
}
.name {
    font-family: Calligraffitti, cursive;
    font-size: 18px;
    word-spacing: 2px;
}
.qeel {
    background-color: #fff;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-top: 15px;
    border-radius: 20px;
}
a.kaishou {
    font-family: Calligraffitti, cursive;
    font-size: 24px;
    word-spacing: 3px;
    color: #7E2BC2;
    text-shadow: #E8E8E8 1px 1px 0;
}
a.shikaisha {
    font-family: 'Dancing Script', cursive;
    font-weight: 700;
    font-size: 24px;
    word-spacing: 3px;
    color: #71B35D;
    text-shadow: #E8E8E8 1px 1px 0;
}
a.yatonin {
    font-family: Calligraffitti, cursive;
    font-size: 24px;
    word-spacing: 3px;
    color: #F07313;
    text-shadow: #E8E8E8 1px 1px 0;
}
a.chibis {
    font-family: 'Dancing Script', cursive;
    font-weight: 700;
    font-size: 24px;
    word-spacing: 3px;
    color: #E6A500;
    text-shadow: #E8E8E8 1px 1px 0;
}
.qeel_titre_colonne {
    font-family: georgia;
    font-style: italic;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -1px;
    text-align: center;
    text-transform: lowercase;
    text-shadow: #E8E8E8 1px 1px 0;
}
.qeel_colonne {
    text-align: justify;
    font-size: 12px;
    vertical-align: top;
    padding: 10px;
}
.mainmenu {
    font-family: georgia;
    font-size: 16px;
    text-transform: lowercase;
    letter-spacing: -1px;
    font-style: italic;
    text-shadow: 1px 1px 0 #fffff;
}
a.mainmenu:active, a.mainmenu:link, a.mainmenu:visited {
    color: #7498A8;
}

.secondarytitle {
    font-family: "Courier New", Courier, Monospace;
    letter-spacing: 2px;
}
a.forumlink {
    border-bottom: 1px dotted;
    font-family: georgia;
    font-style: italic;
    font-size: 17px;
    display: block;
    margin-bottom: 0;
    margin-top: 5px;
    margin-left: 15px;
    letter-spacing: -1px;
    padding-left: -10px;
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
a.forumlink:hover {
    letter-spacing: 3pt;
    padding-left: 10px;
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
a.forumlink:before {
    content: "“ ";
}
.message_sujet {
    font-size: 9px;
}
.t1 {
    display: block;
    font-family: times new roman;
    font-size: 35px;
    text-transform: lowercase;
    letter-spacing: -1px;
    font-style: italic;
    font-weight: lighter;
    text-align: center;
    color: #89bab4;
    padding-bottom: 5px;
}
.st1 {
    padding-top: 5px;
    font-size: 11px;
    font-family: georgia;
    color: #CEB598;
    text-align: center;
    text-transform: lowercase;
    letter-spacing: 3px;
}
.admin1 {
    background-image: url(http://img11.hostingpics.net/pics/739643vfd.png);
    border-bottom: 3px solid #c0ab98;
    border-top: 3px solid #c0ab98;
    border-left: 1px dotted #c0ab98;
    border-right: 1px dotted #c0ab98;
    border-radius: 15px;
    padding: 20px;
}
.admin2 {
    background-color: #f6f3ea;
    border-top: 1px dotted #ceb598;
    border-bottom: 1px dotted #ceb598;
    border-left: 3px solid #ceb598;
    border-right: 3px solid #ceb598;
    border-radius: 15px;
    padding: 8px 10px 10px;
    margin: 10px 20px;
    color: #878787;
    font-style: normal;
}
.forumline {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    overflow: hidden;
}
th#thleft {
    -webkit-border-top-left-radius: 15px;
    z-border-radius-topleft: 15px;
    border-top-left-radius: 15px;
}
th#thright {
    -webkit-border-top-right-radius: 15px;
    -moz-border-radius-topright: 15px;
    border-top-right-radius: 15px;
}
td#tdqeel {
    border-radius: 15px 15px 0 0;
}
.toolbar_avatar {
    width: 25px;
    height: 25px;
    position: relative;
    top: -3px;
    margin-right: 5px;
    border-radius: 3px;
    margin-bottom: -10px;
}
#pa_welcome {
    font-family: Calligraffitti, cursive;
    font-size: 30px;
    word-spacing: 3px;
    color: #609AB5;
    text-shadow: #E8E8E8 1px 1px 0;
}
#pa_navigation {
    text-align: center;
    text-transform: lowercase;
    font-size: 20px;
}
.pa_td {
    vertical-align: top;
    text-align: justify;
    margin-top: 2px;
    margin-right: 5px;
    margin-bottom: 2px;
    margin-left: 5px;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-right: 5px;
    padding-left: 5px;
    background-color: #fff;
    border: 1px solid #E3E3E3;
    border-radius: 8px;
}
.pa_titre {
    color: #609AB5;
    font-family: 'Dancing Script', cursive;
    font-size: 20px;
    text-align: center;
    border-bottom: 1px solid #609AB5;
}
#nav_barr {
    position: fixed;
    width: 790px;
    background-color: #fff;
    border: 1px #fff solid;
    margin-left: -395px;
    left: 50%;
    opacity: .9;
    height: 25px;
}
.quote .code {
    width: 500px;
    overflow-x: auto;
}
::-webkit-scrollbar {
    background-image: url(http://image.noelshack.com/fichiers/2012/36/1346933648-bg.png);
    height: 10px;
    width: 10px;
}
::-webkit-scrollbar-thumb {
    background: #a5a5a5;
    background-image: url(http://image.noelshack.com/fichiers/2012/36/1346933921-bouton.png);
    border-radius: 30px;
}
#chatbox_header .cattitle strong {
    display: none;
}
#chatbox_header .cattitle:before {
    content: "Oserez-vous parler ?";
}
.selectCode {
    float: right;
    text-transform: uppercase;
    cursor: pointer;
    color: #00f;
}
.signature_div img {
    max-height: 300px;
    max-width: 500px;
}
div.infobulle {
    position: relative;
    float: left;
    color: #000;
}
div.infobulle span {
    display: none;
}
div.infobulle:hover {
    background: 0 0;
    z-index: 999;
    color: #000;
}
div.infobulle:hover span {
    display: inline;
    position: absolute;
    width: 150px;
    height: auto;
    top: 115px;
    left: 25px;
    background-color: beige;
    padding: 3px;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
}
a.lienpa {
    font-size: 30px;
    font-family: Impact;
    color: #000;
    letter-spacing: 2px;
}
a.lienpa:hover {
    font-size: 30px;
    font-family: impact;
    color: gray;
    letter-spacing: 2px;
}
.contourlien {
    width: 650px;
    border: 2px #000 solid;
    padding: 10px;
    text-align: center;
    background-color: beige;
    float: left;
    margin-bottom: -30px;
    margin-left: 60px;
}
.contourlien:hover {
    width: 650px;
    border: 2px #000 solid;
    padding: 10px;
    text-align: center;
    background-color: #fff;
    float: left;
    margin-bottom: -30px;
    margin-left: 60px;
}
.contourpa {
    border: 2px #000 solid;
    padding-top: 30px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    background-color: beige;
}
.presforum {
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: beige;
}
.presforum:hover {
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: #fff;
}
.titre {
    font-size: 30px;
    font-family: impact;
    letter-spacing: 1px;
    text-align: center;
    color: gray;
    margin-bottom: -7px;
}
.actus {
    height: 90px;
    overflow: auto;
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: beige;
}
.actus:hover {
    height: 90px;
    overflow: auto;
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: #fff;
}
.partenaire {
    height: 90px;
    overflow: auto;
    text-align: center;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: beige;
}
.partenaire:hover {
    height: 90px;
    overflow: auto;
    text-align: center;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: #fff;
}
.credits {
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 10px;
    font-family: comic sans ms;
}
#tfa_cycle {
    width: 600px;
    height: 200px;
    position: relative;
    overflow: hidden;
    margin: 10px auto;
    padding: 0;
}
.tfa_cycle_content, .tfa_cycle_content1 {
    width: 580px;
    height: 200px;
    margin: auto;
    padding: 0;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}
.tfa_cycle_content {
    background: url(http://i45.servimg.com/u/f45/11/95/30/70/o110.jpg) #143851;
    border-left: 6px solid #bc0a27;
    border-right: 6px solid #78b8ca;
}
.tfa_cycle_content1 {
    background: url(http://i45.servimg.com/u/f45/11/95/30/70/o210.jpg) #143851;
    border-left: 6px solid #78b8ca;
    border-right: 6px solid #bc0a27;
}
.tfa_cycle_content h1, .tfa_cycle_content1 h1 {
    width: 580px;
    margin: 5px auto;
    padding: 0;
    color: #7fb7e5;
    text-transform: uppercase;
    text-align: center;
    font: 17px Orbitron;
    text-shadow: 0 1px 0 #000;
}
.tfa_cycle_content h1:first-letter {
    font: 22px Verdana;
    font-weight: 700;
    color: #42b1ff;
    text-shadow: 0 1px 0 #000;
}
.tfa_cycle_content1 h1:first-letter {
    font: 22px Verdana;
    font-weight: 700;
    color: #C00;
    text-shadow: 0 1px 0 #000;
}
.imgix {
    display: block;
    width: 96%;
    margin: auto;
    text-align: center;
}
.imgix img {
    border: 2px solid #2c587b;
}
.my_news p {
    width: 96%;
    margin: 5px auto 0;
    padding: 0;
    font: 12px Arial;
    color: #cbdeee;
}
div.bulle_msg {
    position: relative;
    cursor: pointer;
}
div.bulle_msg>div {
    display: none;
}
div.bulle_msg:hover {
    background: 0 0;
    z-index: 500;
}
div.bulle_msg:hover>div {
    display: block;
    position: absolute;
    top: 5px;
    left: 15px;
    white-space: nowrap;
    background: #7498A8;
    color: #000;
    padding: 3px;
    border: 1px dotted #000;
}
input.post, textarea.post {
    border-radius: 20px;
}
-RETRAIT : ce CSS pose de nombreux problèmes - {
    display: none;
}
#i_logo {
    margin-right: -10px;
    margin-left: -10px;
    margin-top: -10px;
    margin-bottom: -10px;
}
.opacity img {
    filter: alpha(opacity=70);
    -moz-opacity: .7;
    opacity: .7;
}
.opacity img:hover {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}
.quote {
    font-family: Tahoma;
    font-size: 10px;
    color: #000;
    line-height: 105%;
    border: 1px #d1bfa5 solid;
    border-left-width: 1px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    -moz-border-radius: 6px;
}
.code {
    font-family: Courier, Courier New, sans-serif;
    font-size: 11px;
    color: #000;
    border: 1 px#d1bfa5;
    border-style: solid;
    border-left-width: 1px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    -moz-border-radius: 6px;
}
input, select, textarea {
    -moz-border-radius-bottomleft: 9px;
    -moz-border-radius-bottomright: 9px;
    -moz-border-radius-topleft: 9px;
    -moz-border-radius-topright: 9px;
}
.categ {
    background-color: #dbcfbc;
    padding: 5px;
}
.categcont {
    background-color: #e0d7c9;
    padding: 5px;
    border: 1px solid #a19787;
    height: 100px;
    overflow: auto;
}
.statistiques {
    border: 0;
    background-image: url(http://i34.servimg.com/u/f34/17/84/83/24/quiest14.png);
    background-repeat: no-repeat;
    background-position: center;
    height: 200px;
}
.groupes {
    -moz-border-radius: 8px;
    height: 40px;
    padding-right: 12px;
    padding-left: 14px;
    padding-bottom: 3px;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    text-decoration: none!important;
}
.qeel {
    background-image: url('IMAGE OF FOOTER');
    width: 800px;
    height: 238px;
    margin: auto;
}
.avatar_mess {
    display: block;
    width: 200px;
    height: 320px;
    margin-left: -10px;
    margin-right: 10px;
    overflow: hidden;
    background: #272726;
    border: 5px solid #3e1d19;
    -ms-transform: rotate(-5deg);
    box-shadow: 0 0 6px #000;
    -moz-box-shadow: 0 0 6px #000;
    -o-box-shadow: 0 0 6px #000;
    -htm-box-shadow: 0 0 6px #000;
    -webkit-box-shadow: 0 0 6px #000;
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.avatar_mess:hover {
    margin-left: 5px;
    -ms-transform: rotate(0deg);
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.profil_mess {
    position: absolute;
    display: block;
    width: 190px;
    height: 310px;
    margin: auto;
    padding: 5px;
    overflow: auto;
    background: #fff;
    color: #c5bea0;
    font-size: 11px;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.profil_mess:hover {
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.pseudo_mess {
    display: block;
    position: relative;
    z-index: 2;
    width: 190px;
    margin-top: -15px;
    margin-left: 10px;
    text-align: center;
    font-size: 18px;
    font-family: courier;
    font-weight: 700;
    text-shadow: 0 0 3px #c5bea0;
    background: #EADAC6;
    padding-top: 5px;
    border-left: 3px solid #371e1a;
    border-right: 3px solid #371e1a;
    border-top: 1px solid #371e1a;
    border-bottom: 1px solid #371e1a;
    box-shadow: 0 0 3px #000;
    -moz-box-shadow: 0 0 3px #000;
    -o-box-shadow: 0 0 3px #000;
    -htm-box-shadow: 0 0 3px #000;
    -webkit-box-shadow: 0 0 3px #000;
}
#nu31_accueil {
    width: 950px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 5px;
    height: 200px;
    padding: 10px;
    background: #d2d6d6;
    border: 1px solid #efefef;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -htm-border-radius: 10px;
    -webkit-border-radius: 10px;
    box-shadow: 0 0 5px #425e5c;
    -moz-box-shadow: 0 0 5px #425e5c;
    -o-box-shadow: 0 0 5px #425e5c;
    -htm-box-shadow: 0 0 5px #425e5c;
    -webkit-box-shadow: 0 0 5px #425e5c;
}
#nu31_content {
    width: 950px;
    height: 200px;
    overflow: hidden;
}
#nu31_links {
    float: left;
}
.nu31_link1, .nu31_link2, .nu31_link3, .nu31_link4 {
    width: 150px;
    height: 48px;
    margin-bottom: 2px;
    opacity: .6;
    -moz-opacity: .6;
    -khtml-opacity: .6;
    filter: alpha(opacity=60);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.nu31_link1 {
    background: url(http://img15.hostingpics.net/pics/272286bouton1.jpg);
}
.nu31_link2 {
    background: url(http://img15.hostingpics.net/pics/437826bouton2.jpg);
}
.nu31_link3 {
    background: url(http://img15.hostingpics.net/pics/474878bouton3.jpg);
}
.nu31_link4 {
    background: url(http://img15.hostingpics.net/pics/563812bouton4.jpg);
}
.nu31_link1:hover, .nu31_link2:hover, .nu31_link3:hover, .nu31_link4:hover {
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.nu31_contenu1 {
    width: 800px;
    height: 200px;
    margin-left: 150px;
    background: #e8e8e8;
    border: 1px solid #cccaca;
}
.nu31_contenu2 {
    position: absolute;
    width: 0;
    height: 200px;
    margin-left: 150px;
    overflow: hidden;
    background: #e9c8a4;
    border: 1px solid #cccaca;
    color: #8a6c4c;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.nu31_contenu3 {
    position: absolute;
    width: 0;
    height: 200px;
    margin-left: 150px;
    margin-top: -50px;
    overflow: hidden;
    background: #e9c8a4;
    border: 1px solid #cccaca;
    color: #8a6c4c;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.nu31_contenu4 {
    position: absolute;
    width: 0;
    height: 200px;
    margin-left: 150px;
    margin-top: -100px;
    overflow: hidden;
    background: #e9c8a4;
    border: 1px solid #cccaca;
    color: #8a6c4c;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.nu31_contenu5 {
    position: absolute;
    width: 0;
    height: 200px;
    margin-left: 150px;
    margin-top: -150px;
    overflow: hidden;
    background: #e9c8a4;
    border: 1px solid #cccaca;
    color: #8a6c4c;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.nu31_link1:hover .nu31_contenu2, .nu31_link2:hover .nu31_contenu3, .nu31_link3:hover .nu31_contenu4, .nu31_link4:hover .nu31_contenu5 {
    width: 800px;
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
.nu31_contenu {
    display: block;
    padding: 5px;
    color: #965423;
    font-size: 10px;
    text-align: justify;
}
#f1_accueil {
    width: 800px;
    height: 500px;
    margin: auto;
    background: url(http://i56.servimg.com/u/f56/11/90/82/77/89132412.jpg);
    text-shadow: none!important;
}
#f1_accueil a {
    color: #ba8550!important;
    text-shadow: none!important;
}
#f1_accueil a:hover {
    color: #e58f3a!important;
    text-shadow: none!important;
}
.f1_col1 {
    width: 300px;
    vertical-align: top;
}
.f1_contexte {
    width: 220px;
    height: 300px;
    overflow: auto;
    margin-top: 100px;
    margin-left: 65px;
    text-align: justify;
    color: #7e6144;
    text-shadow: 1px 1px 0 #fff;
}
.f1_bloconglets {
    margin-top: 80px;
}
.f1_onglet1, .f1_onglet2, .f1_onglet3 {
    display: inline-block;
    width: 110px;
    height: 50px;
}
.f1_onglet1 {
    margin-left: 50px;
    margin-right: 25px;
}
.f1_onglet2 {
    margin-right: 30px;
}
.f1_contenu1, .f1_contenu2, .f1_contenu3 {
    position: absolute;
    width: 0;
    height: 220px;
    margin-top: 40px;
    padding-top: 40px;
    overflow: hidden;
    font-size: 11px;
    color: #7e6144;
}
.f1_contenu1 {
    margin-left: -10px;
}
.f1_contenu2 {
    margin-left: -149px;
}
.f1_contenu3 {
    margin-left: -294px;
}
.f1_onglet1:hover .f1_contenu1, .f1_onglet2:hover .f1_contenu2, .f1_onglet3:hover .f1_contenu3 {
    width: 400px;
}
.f1_liens {
    display: block;
    text-align: center;
}
.f1_liens a {
    font-size: 16px;
    font-weight: 700;
}
.f1_friends, .f1_news {
    width: 200px;
    height: 200px;
    overflow: hidden;
    text-align: justify;
}
.f1_credits, .f1_topsites {
    height: 150px;
    border-left: 1px solid #d19962;
    margin-left: 5px;
    padding: 5px;
    text-align: center;
}
.f1_staff1, .f1_staff2, .f1_staff3 {
    display: block;
    width: 50px;
    height: 50px;
    background: url() #d19962;
    margin-bottom: 20px;
    margin-top: 20px;
    border: 1px solid #d19962;
}
.f1_staffcontenu1, .f1_staffcontenu2, .f1_staffcontenu3 {
    position: absolute;
    width: 0;
    height: 150px;
    background: #fff;
    margin-left: 80px;
    overflow: hidden;
}
.f1_staffcontenu2 {
    margin-top: -72px;
}
.f1_staffcontenu3 {
    margin-top: -144px;
}
.f1_staff1:hover .f1_staffcontenu1, .f1_staff2:hover .f1_staffcontenu2, .f1_staff3:hover .f1_staffcontenu3 {
    width: 300px;
    border: 1px solid #d19962;
}
  


et voilà le html


 

Code:

<div id="f1_accueil">
   
   <table style="width: 100%;">
      
      <tbody>
         
         <tr>
            
            <td class="f1_col1">
               
               <div class="f1_contexte">
                   À venir ...
               </div>
               
            </td>
            
            <td style="vertical-align: top;">
               
               <div class="f1_bloconglets">
                  <span class="f1_onglet1">
                  </span>
                  <div class="f1_contenu1">
                     <span class="f1_liens"><a href="#">Lien 1</a> - <a href="#">Lien 1</a> - <a href="#">Lien 1</a> - <a href="#">Lien 1</a></span>
                     <table>
                        
                        <tbody>
                           
                           <tr>
                              
                              <td>
                                 
                                 <div class="f1_news">
                                     <marquee direction="up" scrollamount="2" onmouseover="this.stop();" onmouseout="this.start();"><span style="display: block; text-align: justify;">Toutes les nouvelles du forum seront mis ici. . Le forum est interdit au moins de 18 ans. . Prédéfinis principaux beaucoup sont libres jeter vous dessus. . Je recherche des partenaires de rp Mangas et autres. . Nous recrutons. Allez jetez un coup d'oeil </span></marquee>
                                 </div>
                                 
                              </td>
                              
                              <td>
                                 
                                 <div class="f1_credits">
                                     (c) Crédits du forum<br />Merci à Never-utopia pour leur nombreux code, zerochan.net pour leur image<br />PA par <a href="http://www.never-utopia.com">Never-Utopia</a>.
                                 </div>
                                 
                              </td>
                              
                           </tr>
                           
                        </tbody>
                        
                     </table>
                     
                  </div><span class="f1_onglet1"></span> <span class="f1_onglet2"></span>
                  <div class="f1_contenu2">
                     <span class="f1_staff1">
                     </span>
                     <div class="f1_staffcontenu1">
                         Information staff 1
                     </div><span class="f1_staff1"></span><span class="f1_staff2"></span>
                     <div class="f1_staffcontenu2">
                         Information staff 2
                     </div><span class="f1_staff2"></span><span class="f1_staff3"></span>
                     <div class="f1_staffcontenu3">
                         Information staff 3
                     </div><span class="f1_staff3"></span>
                  </div><span class="f1_onglet2"></span> <span class="f1_onglet3"></span>
                  <div class="f1_contenu3">
                     
                     <table>
                        
                        <tbody>
                           
                           <tr>
                              
                              <td>
                                 
                                 <div class="f1_friends">
                                     <marquee direction="up" scrollamount="2" onmouseover="this.stop();" onmouseout="this.start();"> </marquee>
                                    <center>
                                        partenaires
                                    </center><marquee direction="up" scrollamount="2" onmouseover="this.stop();" onmouseout="this.start();"></marquee>
                                 </div>
                                 
                              </td>
                              
                              <td>
                                 
                                 <div class="f1_topsites">
                                     topsites
                                 </div>
                                 
                              </td>
                              
                           </tr>
                           
                        </tbody>
                        
                     </table>
                     
                  </div><span class="f1_onglet3"></span>
               </div>
               
            </td>
            
         </tr>
         
      </tbody>
      
   </table>
</div>

Merci encore

[Little_dragon]

Up merci

[néco]

le lien que tu as essayé de fournir dans ton 1er message ne donne rien (ce forum n'existe pas)
donc personne ne peux vraiment voir ton soucis ou tenter de t'aider

bizzz

[Little_dragon]

coucou non ta raison a cause j'ai fait une erreur de frappe desoler je vous le redonne maintenant

blackbuttler.forum-canada.com

merci et desoler.

[néco]

j'avoue que par rapport à ce que tu expliques dans ton 1er post , je ne comprend rien , si je compare à ce que je vois en allant sur ton fofo ! ^^

voici ce que je vois !

es ce que tu vois la même chose ?



bizzz


ÉDIT : oups , je viens de comprendre que tu parles de la case de "contexte" tout en haut ! ^^
je croyais que tu parlais des écritures dans tes forums (et j'allais te dire qu'elles sont trop basses et non trop hautes , fin bref ^^ )

je laisse d'autre personne te répondre

[MasDan]

Bonjour,

Pour déplacer le texte «À venir», il s'agit de modifier le «margin-top» et le «margin-left» de la classe «f1_contexte».
J'ai modifier le margin-top de 100 à 130px, voir le résultat.

[Little_dragon]

Merci pour cette éclairage oui j'ai remarqué aussi pour les autres écritures trop base comment est-ce que je pourrais arranger cela ? et j'ai aussi un autre petit problème avec la pa c'est que ou il y a les new staff et partenaires il est suposser d'apparaitre les écritures quand je passe la souris sur les titre new etc... mais sa ne fait rien du tout :S merci pour ton aide...

[Little_dragon]

salut Up encore un petit problème a régler:)

[Little_dragon]

un petit up

[MasDan]

Bonjour,

Essayer ceci :

1) Ajouter à votre CSS

Code:

#PanAccueil {
  width: 800px;
  height: 500px;
  margin: auto;
  background: url(http://i56.servimg.com/u/f56/11/90/82/77/89132412.jpg);
}

#btNews {
 position: absolute;
 margin-top: 195px;
 margin-left: 350px;
  width: 80px;
  height: 45px;
}

#btStaff {
 position: absolute;
 margin-top: 195px;
 margin-left: 475px;
  width: 120px;
  height: 45px;
}
#btAmis {
 position: absolute;
 margin-top: 195px;
 margin-left: 640px;
  width: 110px;
  height: 45px;
}

.news, .staff, .amis {
  display: none;
}

.marquee {
  height: 84px;
}

.partenaires {
  margin: 5px 0 10px;
}

2) Créer un javascript

Code:

function bouton(prm) {
 $("div.fen2 > div").css('display', 'none');
 $("div.fen2 div." + prm).css('display', 'inherit');
}

3) Remplacer votre HTML fournit au premier message par ceci

Code:

<div  id="PanAccueil">
 <div id="btNews" onMouseOver="bouton('news');"></div>
 <div id="btStaff" onMouseOver="bouton('staff');"></div>
 <div id="btAmis" onMouseOver="bouton('amis');"></div>
 <div class="fen1">
 À venir ...
 </div>
 <div class="fen2">
 <div class="news">news
 <div class="f1_credits">
            (c) Crédits du forum<br />
 Merci à Never-utopia pour leur nombreux code, zerochan.net pour leur image<br />
 PA par <a href="http://www.never-utopia.com">Never-Utopia</a>.
         </div>
      </div>
 <div class="staff">staff</div>
 <div class="amis">
 <div>
 <marquee class="marquee" direction="up" scrollamount="2" onmouseover="this.stop();" onmouseout="this.start();">
 <p>
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. In erat risus, ornare ut eleifend ac, pretium a est. Maecenas et urna eget ipsum facilisis rhoncus. Ut vel scelerisque neque. Aenean sollicitudin vitae ipsum non tristique. Donec fermentum eu lacus at accumsan. Vivamus hendrerit pharetra augue at pharetra. Curabitur vel nunc lacus.
 </p>
 <p>
 Vivamus at erat massa. Aliquam ac dolor ipsum. Proin at lacus eros. Maecenas in eros nisi. Donec egestas diam nibh, sed fringilla nunc pellentesque ac. Phasellus at libero consectetur, malesuada mauris vel, imperdiet urna. Suspendisse ac vestibulum dui. Nam non faucibus est. Cras egestas lorem nec mauris semper cursus.
</p>
 </marquee>
 <center class="partenaires">partenaires (à venir)</center>
 <marquee class="marquee" direction="up" scrollamount="2" onmouseover="this.stop();" onmouseout="this.start();">
 <p>
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque pellentesque leo quis laoreet vehicula. Mauris adipiscing, risus ut feugiat mollis, nisl nisl venenatis sem, sit amet imperdiet metus massa vel tortor. Donec ut tempor sem. Integer nisl nulla, fringilla vitae velit at, tincidunt blandit orci. Vivamus ornare purus pretium ipsum dictum, ut ullamcorper mauris placerat. Nunc fringilla tincidunt nisl, eu rutrum felis vehicula vel. Phasellus at venenatis eros. Quisque non tincidunt enim. Etiam ornare iaculis fermentum. Pellentesque ut viverra quam, eu feugiat urna. Sed mollis velit non tellus elementum condimentum. Phasellus vitae luctus tellus, nec ultricies risus. Sed fermentum nisi eros, tincidunt lobortis lorem dictum in. Nullam nec congue ipsum, sed aliquam magna. Morbi nibh ligula, interdum eget sagittis ut, bibendum sit amet nulla. Ut vel elit libero.
 </p>
 <p>
 Proin nibh quam, facilisis vestibulum enim at, posuere sollicitudin mauris. Vestibulum consectetur, tortor et aliquam tincidunt, leo nunc interdum erat, nec blandit massa nibh ac felis. Nullam consequat, turpis ac tristique congue, purus lorem suscipit massa, non scelerisque tortor diam eget lacus. Cras cursus a neque quis mollis. Ut vehicula aliquet erat ut tempor. Morbi tortor sapien, laoreet quis augue ut, sollicitudin rutrum massa. Nunc sed odio ac neque viverra elementum. Quisque mollis est ac consequat scelerisque. Proin hendrerit eget mauris ut commodo. Praesent et ligula nisi. Pellentesque leo ante, ullamcorper eget adipiscing non, sodales nec neque. Donec congue fermentum risus vel cursus. Donec dapibus, felis sit amet bibendum placerat, ipsum felis mattis orci, sed rutrum neque mauris nec nisl. Praesent rhoncus ac nibh eu mattis. Maecenas venenatis, nulla faucibus pulvinar ornare, velit arcu imperdiet arcu, ac sagittis odio felis sit amet libero. Nulla diam lorem, eleifend ut sapien eget, lacinia consequat enim. </p>
 </p>
 </marquee>
        </div>
 </div>
 </div>
 </div>

[Little_dragon]

salut merci je voulais savoir pour le javascript je ne sais pas comment le creer et ou le faire et il y a un probleme pour le contexte le A venir est place en haut dans le gros carrer et il est supposer etre dans le carrer contexte merci beaucoup

edit : Avec un tuto ici sur forumactif j' ai pu creer le javascript mais je ne vois pas de changement est-ce normal ?

edit 2 : J'ai reussis a faire le javascript et sa fonctionne par contre les ecritures n' apparait pas a la bonne bonne place il son supposer etre dans les carrer bleu fonces ? je ne sais pas comment faire en sorte que sa soit a la bonne place voila mon code css au complet...

Code:

#PanAccueil {
  width: 800px;
  height: 500px;
  margin: auto;
  background: url(http://i56.servimg.com/u/f56/11/90/82/77/89132412.jpg);
}
 
#btNews {
 position: absolute;
 margin-top: 100px;
 margin-left: 130px;
  width: 80px;
  height: 45px;
}
 
#btStaff {
 position: absolute;
 margin-top: 195px;
 margin-left: 475px;
  width: 120px;
  height: 45px;
}
#btAmis {
 position: absolute;
 margin-top: 195px;
 margin-left: 640px;
  width: 110px;
  height: 45px;
}
 
.news, .staff, .amis {
  display: none;
}
 
.marquee {
  height: 84px;
}
 
.partenaires {
  margin: 5px 0 10px;
}body{
    background-position: top center;
}

#navig a.mainmenu{
    font-size: 16px;
    color:#000;
}
#navig{
    width:1200px;
    margin: auto;
    text-align: center;
}

#navigation{
    position: absolute;
    z-index: 999;
    width: 100%;
    background-color: #cecece;
    border-bottom: 2px solid #828282;
    margin-top: -10px;
    margin-left: -10px;
    padding: 5px;
}

table.forumline {
    border: 1px dotted;
}

a:hover {
    text-transform: uppercase;
}

a:hover, a:link {
    text-decoration: none !important;
}
   
.bodylinewidth {
    width: 990px;
    margin: auto;
    margin-top: 380px;
}

a.mainmenu {
    text-decoration: none;
    color: #9A4054;
    font-size: 22px;
    font-family: Brush Script MT;
    text-shadow: 0 0 0 #B9AF96;
    transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -htm-transition: all 1s;
    -webkit-transition: all 1s;
}

a.mainmenu:hover {
    text-decoration: none;
    color: #D4474D;
    text-shadow: 0 2px 2px #EBEAE6;
    transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -htm-transition: all 1s;
    -webkit-transition: all 1s;
}

.bodyline {
    padding: 0;
}

.forumline {
    border-top: 5px solid #EADBDD;
    border-bottom: 5px solid #EADBDD;
}

.cate_titre {
    clear: both;
    height: 100px;
    margin-top: 50px;
}
 
.catetitre_bloc {
    position: relative;
    z-index: 1;
    display: block;
    width: 90%;
    height: 20px;
    margin: auto;
    background-color: #a8a8a8;
    transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    -htm-transform: rotate(5deg);
}

.catetitre_content {
    position: absolute;
    z-index: 2;
    display: block;
    width: 950px;
    margin: -40px auto 0px;
    text-align: center;
    padding: 2px;
    border-bottom: 3px dotted #191817;
}
   
.catetitre {
    color: #454545;
    font-family: arial;
    font-size: 26px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 1px 1px 0 #000;
}

.forum_bloc {
    width: 950px;
    margin: -30px auto 0px;
}
   
.forum {
    float: left;
    width: 460px;
    height: 250px;
    margin-left: 0px 5px 50px;
}
   
a.forumlink {
    position: relative;
    z-index: 2;
    width: 100%;
    color: #454545;
    text-align: center;
    font-weight: 700;
    text-transform: uppercase;
    text-shadow: 1px 1px 0 #000;
}
   
.forum_contenu {
    position: relative;
    z-index: 1;
    width: 98%;
    height: 90%;
    padding: 4px;
    margin: -8px auto 0px;
    background-color: #d9d9d9;
    border: 1px dotted #191817;
    border-top: 5px solid #191817;
}
   
.description {
    display: block;
    width: 400px;
    margin: auto;
    height: 100px;
    overflow: hidden;
    border: 2px solid #9c9c9c;
    box-shadow: 1px 1px 1px #191817;
    -moz-box-shadow: 1px 1px 1px #191817;
    -htm-box-shadow: 1px 1px 1px #191817;
    -webkit-box-shadow: 1px 1px 1px #191817;
    -o-box-shadow: 1px 1px 1px #191817;
}
   
.description_contenu {
    position: absolute;
    display: block;
    width: 391px;
    height: 91px;
    overflow: auto;
    background-color: #191817;
    font-size: 10px;
    color: #9c9c9c;
    text-align: justify;
    padding: 5px;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -htm-transition: all 1s;
    -webkit-transition: all 1s;
}
   
.description_contenu:hover {
    opacity: .8;
    -moz-opacity: .8;
    -khtml-opacity: .8;
    filter: alpha(opacity=80);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
   
.icone_stats {
    width: 300px;
    margin: -30px auto 0px;
}
   
.stats_lastpost {
    display: block;
    width: 160px;
    height: 80px;
    margin-left: 10px;
    background-color: #c8c8c8;
    border: 1px solid #b5b5b5;
    padding: 5px;
    text-align: center;
}

.stats {
    display: block;
    margin-bottom: 5px;
    border-bottom: 1px dotted #b5b5b5;
    padding-bottom: 5px;
    font-size: 10px;
    color: #8f8f8f;
}
   
.lastpost {
    display: block;
    font-size: 11px;
}
   
.sforum {
    position: relative;
    z-index: 3;
    display: block;
    height: 0;
    background: #191817;
    color: #b5b5b5;
    overflow: hidden;
    transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -htm-transition: all 1s;
    -webkit-transition: all 1s;
}
   
.ouverture_sousforum {
    position: relative;
    z-index: 3;
    display: block;
    float: right;
    width: 120px;
    margin-right: 20px;
    background: #191817;
    color: #b5b5b5;
    font-size: 11px;
    text-align: center;
    padding: 4px;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-bottom-right-radius: 10px;
    -moz-border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}
   
.sous_forum:hover .sforum {
    height: 50px;
    background: #191817;
    color: #b5b5b5;
    padding: 4px;
    overflow: auto;
    transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -htm-transition: all 1s;
    -webkit-transition: all 1s;
}

.sous_forum a {
    color: #b5b5b5 !important;
    text-shadow: 1px 1px 0 #000;
}
   
.sous_forum a:hover {
    color: #fff !important;
}

a {
    color: #D6AA45;
    text-decoration: none;
}
   
.toolbar_avatar {
    width: 25px;
    height: 25px;
    position: relative;
    top: -3px;
    margin-right: 5px;
    border-radius: 3px;
    margin-bottom: -10px;
}
   
#pa_welcome {
    font-family: Calligraffitti, cursive;
    font-size: 30px;
    word-spacing: 3px;
    color: #609AB5;
    text-shadow: #E8E8E8 1px 1px 0;
}
   
#pa_navigation {
    text-align: center;
    text-transform: lowercase;
    font-size: 20px;
}
   
.pa_td {
    vertical-align: top;
    text-align: justify;
    margin: 2px 5px;
    padding: 2px 5px;
    background-color: #fff;
    border: 1px solid #E3E3E3;
    border-radius: 8px;
}
   
.pa_titre {
    color: #609AB5;
    font-family: 'Dancing Script', cursive;
    font-size: 20px;
    text-align: center;
    border-bottom: 1px solid #609AB5;
}
   
#nav_barr {
    position: fixed;
    width: 790px;
    background-color: #fff;
    border: 1px #fff solid;
    margin-left: -395px;
    left: 50%;
    opacity: .9;
    height: 25px;
}
   
.quote .code {
    width: 500px;
    overflow-x: auto;
}
   
::-webkit-scrollbar {
    background-image: url(http://image.noelshack.com/fichiers/2012/36/1346933648-bg.png);
    height: 10px;
    width: 10px;
}
   
::-webkit-scrollbar-thumb {
    background: #a5a5a5;
    background-image: url(http://image.noelshack.com/fichiers/2012/36/1346933921-bouton.png);
    border-radius: 30px;
}
   
#chatbox_header .cattitle strong {
    display: none;
}
   
#chatbox_header .cattitle:before {
    content: "Oserez-vous parler ?";
}
   
.selectCode {
    float: right;
    text-transform: uppercase;
    cursor: pointer;
    color: #00f;
}
   
.signature_div img {
    max-height: 300px;
    max-width: 500px;
}
   
div.infobulle {
    position: relative;
    float: left;
    color: #000;
}
   
div.infobulle span {
    display: none;
}
   
div.infobulle:hover {
    background: 0 0;
    z-index: 999;
    color: #000;
}
   
div.infobulle:hover span {
    display: inline;
    position: absolute;
    width: 150px;
    height: auto;
    top: 115px; left: 25px;
    background-color: beige;
    padding: 3px;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
}
   
a.lienpa {
    font-size: 30px;
    font-family: Impact;
    color: #000;
    letter-spacing: 2px;
}
   
a.lienpa:hover {
    font-size: 30px;
    font-family: impact;
    color: gray;
    letter-spacing: 2px;
}
   
.contourlien {
    width: 650px;
    border: 2px #000 solid;
    padding: 10px;
    text-align: center;
    background-color: beige;
    float: left;
    margin-bottom: -30px;
    margin-left: 60px;
}

.contourlien:hover {
    width: 650px;
    border: 2px #000 solid;
    padding: 10px;
    text-align: center;
    background-color: #fff;
    float: left;
    margin-bottom: -30px;
    margin-left: 60px;
}
   
.contourpa {
    border: 2px #000 solid;
    padding: 30px 10px 10px;
    background-color: beige;
}
   
.presforum {
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: beige;
}
   
.presforum:hover {
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: #fff;
}
   
.titre {
    font-size: 30px;
    font-family: impact;
    letter-spacing: 1px;
    text-align: center;
    color: gray;
    margin-bottom: -7px;
}
   
.actus {
    height: 90px;
    overflow: auto;
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: beige;
}
   
.actus:hover {
    height: 90px;
    overflow: auto;
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: #fff;
}
   
.partenaire {
    height: 90px;
    overflow: auto;
    text-align: center;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: beige;
}
   
.partenaire:hover {
    height: 90px;
    overflow: auto;
    text-align: center;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 12px;
    font-family: comic sans ms;
    background-color: #fff;
}
   
.credits {
    text-align: justify;
    border: 2px #000 solid;
    padding: 10px;
    color: #000;
    font-size: 10px;
    font-family: comic sans ms;
}
   
#tfa_cycle {
    width: 600px;
    height: 200px;
    position: relative;
    overflow: hidden;
    margin: 10px auto;
    padding: 0;
}
   
.tfa_cycle_content, .tfa_cycle_content1 {
    width: 580px;
    height: 200px;
    margin: auto;
    padding: 0;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

.tfa_cycle_content {
    background: url(http://i45.servimg.com/u/f45/11/95/30/70/o110.jpg) #143851;
    border-left: 6px solid #bc0a27;
    border-right: 6px solid #78b8ca;
}
   
.tfa_cycle_content1 {
    background: url(http://i45.servimg.com/u/f45/11/95/30/70/o210.jpg) #143851;
    border-left: 6px solid #78b8ca;
    border-right: 6px solid #bc0a27;
}
   
.tfa_cycle_content h1, .tfa_cycle_content1 h1 {
    width: 580px;
    margin: 5px auto;
    padding: 0;
    color: #7fb7e5;
    text-transform: uppercase;
    text-align: center;
    font: 17px Orbitron;
    text-shadow: 0 1px 0 #000;
}
   
.tfa_cycle_content h1:first-letter {
    font: 22px Verdana;
    font-weight: 700;
    color: #42b1ff;
    text-shadow: 0 1px 0 #000;
}
   
.tfa_cycle_content1 h1:first-letter {
    font: 22px Verdana;
    font-weight: 700;
    color: #C00;
    text-shadow: 0 1px 0 #000;
}
   
.imgix {
    display: block;
    width: 96%;
    margin: auto;
    text-align: center;
}
   
.imgix img {
    border: 2px solid #2c587b;
}
   
.my_news p {
    width: 96%;
    margin: 5px auto 0;
    padding: 0;
    font: 12px Arial;
    color: #cbdeee;
}
   
div.bulle_msg {
    position: relative;
    cursor: pointer;
}
   
div.bulle_msg>div {
    display: none;
}
   
div.bulle_msg:hover {
    background: 0 0;
    z-index: 500;
}

div.bulle_msg:hover>div {
    display: block;
    position: absolute;
    top: 5px;
    left: 15px;
    white-space: nowrap;
    background: #7498A8;
    color: #000;
    padding: 3px;
    border: 1px dotted #000;
}
   
input.post, textarea.post {
    border-radius: 20px;
}

#i_logo {
    margin: -10px;
}
   
.opacity img {
    filter: alpha(opacity=70);
    -moz-opacity: .7;
    opacity: .7;
}
   
.opacity img:hover {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}
   
.quote {
    font-family: Tahoma;
    font-size: 10px;
    color: #000;
    line-height: 105%;
    border: 1px #d1bfa5 solid;
    -moz-border-radius: 6px;
}
   
.code {
    font-family: Courier, Courier New, sans-serif;
    font-size: 11px;
    color: #000;
    border: 1px solid #d1bfa5;
    -moz-border-radius: 6px;
}

input, select, textarea {
    -moz-border-radius:9px;
}
   
.categ {
    background-color: #dbcfbc;
    padding: 5px;
}
   
.categcont {
    background-color: #e0d7c9;
    padding: 5px;
    border: 1px solid #a19787;
    height: 100px;
    overflow: auto;
}
   
.statistiques {
    border: 0;
    background-image: url(http://i34.servimg.com/u/f34/17/84/83/24/quiest14.png);
    background-repeat: no-repeat;
    background-position: center;
    height: 200px;
}

.groupes {
    -moz-border-radius: 8px;
    height: 40px;
    padding: 0px 12px 3px 14px;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    text-decoration: none !important;
}
   
.qeel {
    background-image: url('IMAGE OF FOOTER');
    width: 800px;
    height: 238px;
    margin: auto;
}
   
.avatar_mess {
    display: block;
    width: 200px;
    height: 320px;
    margin-left: -10px;
    margin-right: 10px;
    overflow: hidden;
    background: #272726;
    border: 5px solid #3e1d19;
    -ms-transform: rotate(-5deg);
    box-shadow: 0 0 6px #000;
    -moz-box-shadow: 0 0 6px #000;
    -o-box-shadow: 0 0 6px #000;
    -htm-box-shadow: 0 0 6px #000;
    -webkit-box-shadow: 0 0 6px #000;
    transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -htm-transition: all 1s;
    -webkit-transition: all 1s;
}
   
.avatar_mess:hover {
    margin-left: 5px;
    -ms-transform: rotate(0deg);
    transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -htm-transition: all 1s;
    -webkit-transition: all 1s;
}
   
.profil_mess {
    position: absolute;
    display: block;
    width: 190px;
    height: 310px;
    margin: auto;
    padding: 5px;
    overflow: auto;
    background: #fff;
    color: #c5bea0;
    font-size: 11px;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -htm-transition: all 1s;
    -webkit-transition: all 1s;
}
   
.profil_mess:hover {
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -htm-transition: all 1s;
    -webkit-transition: all 1s;
}
   
.pseudo_mess {
    display: block;
    position: relative;
    z-index: 2;
    width: 190px;
    margin-top: -15px;
    margin-left: 10px;
    text-align: center;
    font-size: 18px;
    font-family: courier;
    font-weight: 700;
    text-shadow: 0 0 3px #c5bea0;
    background: #EADAC6;
    padding-top: 5px;
    border-width: 1px 3px;
    border-style: solid;
    border-color: #371e1a;
    box-shadow: 0 0 3px #000;
    -moz-box-shadow: 0 0 3px #000;
    -o-box-shadow: 0 0 3px #000;
    -htm-box-shadow: 0 0 3px #000;
    -webkit-box-shadow: 0 0 3px #000;
}
   
#nu31_accueil {
    width: 950px;
    margin: 10px auto 5px;
    height: 200px;
    padding: 10px;
    background: #d2d6d6;
    border: 1px solid #efefef;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -htm-border-radius: 10px;
    -webkit-border-radius: 10px;
    box-shadow: 0 0 5px #425e5c;
    -moz-box-shadow: 0 0 5px #425e5c;
    -o-box-shadow: 0 0 5px #425e5c;
    -htm-box-shadow: 0 0 5px #425e5c;
    -webkit-box-shadow: 0 0 5px #425e5c;
}
   
#nu31_content {
    width: 950px;
    height: 200px;
    overflow: hidden;
}
   
#nu31_links {
    float: left;
}
   
.nu31_link1, .nu31_link2, .nu31_link3, .nu31_link4 {
    width: 150px;
    height: 48px;
    margin-bottom: 2px;
    opacity: .6;
    -moz-opacity: .6;
    -khtml-opacity: .6;
    filter: alpha(opacity=60);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}

.nu31_link1:hover, .nu31_link2:hover, .nu31_link3:hover, .nu31_link4:hover{
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}

.nu31_contenu1 {
    width: 800px;
    height: 200px;
    margin-left: 150px;
    background: #e8e8e8;
    border: 1px solid #cccaca;
}

.nu31_contenu2 {
    position: absolute;
    width: 0;
    height: 200px;
    margin-left: 150px;
    overflow: hidden;
    background: #e9c8a4;
    border: 1px solid #cccaca;
    color: #8a6c4c;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}

.nu31_contenu3 {
    position: absolute;
    width: 0;
    height: 200px;
    margin-left: 150px;
    margin-top: -50px;
    overflow: hidden;
    background: #e9c8a4;
    border: 1px solid #cccaca;
    color: #8a6c4c;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
 
.nu31_contenu4 {
    position: absolute;
    width: 0;
    height: 200px;
    margin-left: 150px;
    margin-top: -100px;
    overflow: hidden;
    background: #e9c8a4;
    border: 1px solid #cccaca;
    color: #8a6c4c;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}
   
.nu31_contenu5 {
    position: absolute;
    width: 0;
    height: 200px;
    margin-left: 150px;
    margin-top: -150px;
    overflow: hidden;
    background: #e9c8a4;
    border: 1px solid #cccaca;
    color: #8a6c4c;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    filter: alpha(opacity=0);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}

.nu31_link1:hover .nu31_contenu2, .nu31_link2:hover .nu31_contenu3, .nu31_link3:hover .nu31_contenu4, .nu31_link4:hover .nu31_contenu5 {
    width: 800px;
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
}

.nu31_contenu {
    display: block;
    padding: 5px;
    color: #965423;
    font-size: 10px;
    text-align: justify;
}
   
#f1_accueil {
    width: 800px;
    height: 500px;
    margin: auto;
    background: url(http://i56.servimg.com/u/f56/11/90/82/77/89132412.jpg);
    text-shadow: none!important;
}
   
#f1_accueil a {
    color: #ba8550!important;
    text-shadow: none!important;
}
   
#f1_accueil a:hover {
    color: #e58f3a!important;
    text-shadow: none!important;
}
   
.f1_col1 {
    width: 300px;
    vertical-align: top;
}
   
.f1_contexte {
    width: 220px;
    height: 300px;
    overflow: auto;
    margin-top: 130px;
    margin-left: 65px;
    text-align: justify;
    color: #7e6144;
    text-shadow: 1px 1px 0 #fff;
}
   
.f1_bloconglets {
    margin-top: 80px;
}
   
.f1_onglet1, .f1_onglet2, .f1_onglet3 {
    display: inline-block;
    width: 110px;
    height: 50px;
}
   
.f1_onglet1 {
    margin-left: 50px;
    margin-right: 25px;
}
   
.f1_onglet2 {
    margin-right: 30px;
}

.f1_contenu1, .f1_contenu2, .f1_contenu3 {
    position: absolute;
    width: 0;
    height: 220px;
    margin-top: 40px;
    padding-top: 40px;
    overflow: hidden;
    font-size: 11px;
    color: #7e6144;
}
 
.f1_contenu1 {
    margin-left: -10px;
}
   
.f1_contenu2 {
    margin-left: -149px;
}
   
.f1_contenu3 {
    margin-left: -294px;
}

.f1_onglet1:hover .f1_contenu1, .f1_onglet2:hover .f1_contenu2, .f1_onglet3:hover .f1_contenu3 {
    width: 400px;
}

.f1_liens {
    display: block;
    text-align: center;
}
   
.f1_liens a {
    font-size: 16px;
    font-weight: 700;
}
   
.f1_friends, .f1_news {
    width: 200px;
    height: 200px;
    overflow: hidden;
    text-align: justify;
}
   
.f1_credits, .f1_topsites {
    height: 150px;
    border-left: 1px solid #d19962;
    margin-left: 5px;
    padding: 5px;
    text-align: center;
}
   
.f1_staff1, .f1_staff2, .f1_staff3 {
    display: block;
    width: 50px;
    height: 50px;
    background: url() #d19962;
    margin: 20px 0;
    border: 1px solid #d19962;
}
   
.f1_staffcontenu1, .f1_staffcontenu2, .f1_staffcontenu3 {
    position: absolute;
    width: 0;
    height: 150px;
    background: #fff;
    margin-left: 80px;
    overflow: hidden;
}
   
.f1_staffcontenu2 {
    margin-top: -72px;
}
   
.f1_staffcontenu3 {
    margin-top: -144px;
}
   
.f1_staff1:hover .f1_staffcontenu1, .f1_staff2:hover .f1_staffcontenu2, .f1_staff3:hover .f1_staffcontenu3 {
    width: 300px;
    border: 1px solid #d19962;
}
     
/* QEEL */

.trans .row1 {
    background-color: #CDCCC8;
}

.titreqeel {
    color: #2E3454;
    font-family: 'Finger Paint', cursive;
    font-size: 45px;
    text-align: center;
}

.cadreqeel {
    background-color: #CDCCC8;
    color: #5C5C5C;
    padding: 15px;
    width: 210px;
    height: 190px;
    text-align: justify;
    font-family: arial;
    font-size: 10px;
    -moz-border-radius: 310px;
    -webkit-border-radius: 310px;
    border-radius: 310px;
}

.cadreqeel1 {
    background-color: #CDCCC8;
    color: #5C5C5C;
    padding: 15px;
    width: 210px;
    height: 190px;
    text-align: justify;
    font-family: arial;
    font-size: 10px;
    -moz-border-radius: 310px;
    -webkit-border-radius: 310px;
    border-radius: 310px;
}

.cadreqeel2 {
    background-color: #CDCCC8;
    color: #5C5C5C;
    padding: 15px;
    width: 500px;
    height: 100px;
    overflow: auto;
    text-align: justify;
    font-family: arial;
    font-size: 10px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
}

.boite10 {
    margin-left: 20px;
    margin-top: 25px;
    width: 180px;
    height: 180px;
    overflow: auto;
}

.groupes {
    font-family: 'Gabriela', serif;
    text-align: center !important;
    font-size: 20px;
}

[MasDan]

Bonjour,

Oups.     Il manque deux classes au CSS que j'ai fournis. Il faut ajouter ceci à votre CSS.

Code:

.fen1 {
 position: absolute;
 margin-top: 130px;
 margin-left: 35px;
  width: 290px;
  height: 330px;
  overflow: auto;
  text-align: justify;
  color: #7e6144;
  text-shadow: 1px 1px 0 #fff;
}

.fen2 {
 position: absolute;
 margin-top: 253px;
 margin-left: 358px;
  width: 410px;
  height: 214px;
  overflow: auto;
  text-align: justify;
  color: #7e6144;
  text-shadow: 1px 1px 0 #fff;
}


Aussi au CSS pour l'id #btNews, il y a erreur pour le margin-top et margin-left.
Tel que spécifié dans le code déjà fournis, nous devrions avoir plutôt ceci

Code:

 margin-top: 195px;
  margin-left: 350px;


Et finalement au HTML, il y a une balise ouvrant P (surligné en jaune à la ligne 235 de la figure suivante) de trop qu'il faudrait supprimer.

[Little_dragon]

Coucou tout est parfait pour la pa Merci beaucoup pour l' aide apporter je suis contente

juste une petite derniere question avant de fermer le sujet est-il possible de changer le types de font de l' ecriture ? dans la pa ? si oui comment merci encore

[MasDan]

juste une petite derniere question avant de fermer le sujet est-il possible de changer le types de font de l' ecriture ? dans la pa ? si oui  comment merci encore

Pour la PA, il s'agit de modifier la classe fen1 pour la première boîte (contexte) et la classe fen2 pour la boîte (news, le staff et nos amis). Présentement les deux classes font appel aux attribut  color et text-shadow.

[Little_dragon]

coucou et merci pour ton aide ^^ j'ai fais un changement d'image et je ne sais pas pourquoi que l'écriture ne rentre pas totalement seulement dans le carrer celui du Contexte ?

[MasDan]

Comme nous écrivons en surimpression sur l'image, si l'on change l'image, alors il faut si les boîtes et les boutons ne sont plus au même endroit, recalculer les valeurs pour les attributs margin-top, margin-left, width et height.

On peu utiliser l'inspecteur d'élément via le nagateur pour trouver les nouvelles valeurs ou utiliser un logiciel de traitement d'image (photoshop, gimp et même paint).

Voici les nouvelles valeurs pour les attributs ci-haut mentionnés.

Code:

.fen1 {
 position: absolute;
 margin-top: 133px;
 margin-left: 28px;
  width: 250px;
  height: 350px;
  overflow: auto;
  text-align: justify;
  color: #7e6144;
  text-shadow: 1px 1px 0 #fff;
}

.fen2 {
 position: absolute;
 margin-top: 178px;
 margin-left: 325px;
  width: 455px;
  height: 300px;
  overflow: auto;
  text-align: justify;
  color: #7e6144;
  text-shadow: 1px 1px 0 #fff;
}

#btNews {
 position: absolute;
 margin-top: 120px;
 margin-left: 365px;
  width: 80px;
  height: 45px;
}

#btStaff {
 position: absolute;
 margin-top: 120px;
 margin-left: 485px;
  width: 80px;
  height: 45px;
}

#btAmis {
 position: absolute;
 margin-top: 120px;
 margin-left: 610px;
  width: 140px;
  height: 45px;
}
.marquee {
  height: 130px;
}


[Little_dragon]

ouff j'ai eu peur cinq minutes lol a cause j'avais tout effacer mais j'ai suivis ce que tu m'avais donnee et la c'est a la perfection je te remercie de ta patience avec moi et je mets en résolu

Donc voilà un problème de moins