CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur: Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus! |
| Problème de position dans la PA | |
| Katara
{ Membre }
Messages : 32
| Bonjour à tous ! Le premier est résolu, mais pas le second : Alors, voilà mon problème ^^ Sur mon gros PC (celui avec un centrale), je vois ma page d'accueil parfaitement, exactement comme je veux quelle soit. Mais quand je vais sur le PC portable, catastrophe ... il y des choses qui se collent à gauche, au lieu d'être centré. Le problème c'est que c'est à l'intérieur d'un tableau ... Et j'ai mis je ne sais pas comme bien de "right" ou de "center" à l'intérieur des cellulles, mais ça ne marche toujours pas ! Au début, je pensais que c'était à cause de navigateur ... Mais non, c'est bien Internet explorer 7 ! Et mon amie qui est fondatrice du forum n'arrive pas aussi à voir correctement la PA =/ C'est vraiment très laid ... Je vous montre :
- Spoiler:
Comme vous voyez, tout est parfaitement aligné. Sauf que sur d'autres PC, en dessous des "liens rapides", les liens se trouvent à gauche au lieu d'être centrés ! Mais l'image des "liens rapides", elle, bah elle est bien centré, par contre -_->> Un autre problème. Sur les autres ordinateurs, les images qui défilent en dessous de "Partenaires", se bloquent à 1/3 du défilement, et ensuite ça recommence. Alors que sur mon PC, tout défile correctement ! J'espère que vous m'avez compris xD |
Dernière édition par Katara le Jeu 28 Oct 2010, 07:09, édité 1 fois | |
| | | Radimir
{ Membre actif }
Messages : 459
| Bonjour,
Pour pouvoir vous aidez au mieux , il nous faut le lien de votre forum , le css ainsi que le html utilisé pour la PA. | | |
| | | Katara
{ Membre }
Messages : 32
| Oui bien sûr ^^ Alors : Lien du forum : http://gakuen-yokotsui.forumactif.com/ CSS - Spoiler:
- Code:
-
.forumline { border: 1px # a08491 en pointillés ; }
.Bodyline { background-color : # transp ; border: 1px # a08491 pointillé ; } u { border-bottom : 1px pointillé ; border-color : # 000000 ; text-decoration : none }
I { border-bottom : none; color: # b3234c ; text-decoration : none }
a:hover { text-decoration : none; border-bottom : 1px # 704a5c pointillés ;
}
.bodylinewidth { largeur: 60% }
une img { border: none; }
a.cattitle { text-decoration : none; color: # dba1c1 ; } a.cattitle : hover { text-decoration : none; } . forumlink { font- weight: bold ; font-size : 12px ; color: # 9e6776 ; } a.forumlink { text-decoration : none; color: # d7b9c7 ; } a.forumlink : hover { text-decoration : none; couleur: # cf869b ; } a.nav { text-decoration : none; color: # ac8289 ; } a.nav : hover { text-decoration : none; } a.topictitle : visited { text-decoration : none; color: # dba1c1 ; } a.topictitle : hover { text-decoration : none; couleur: # c497bf ; } a.postlink : hover { text-decoration : none; Couleur: c497bf #} a.gen : hover , a.genmed : hover , a.gensmall : hover { couleur: # c497bf ; text-decoration : none; } a.mainmenu { text-decoration : none; color: # 82556a ; background-color: #CCCCCC; } a.mainmenu : hover { text-decoration : none; couleur: # ad4e7b ; } a.copyright : hover { color: # dba1c1 ; text-decoration : none; } a:link { text-decoration : none; }
a:visited { text-decoration : none; }
a:active { text-decoration : none; } a:link {text-decoration : none;} a:hover {text- decoration: none ! important ; } a { text-decoration : none;} a:link {text-decoration : none;} a:hover {text-decoration : none;} a.gen : hover , a.genmed : hover , a.gensmall : hover {background-color : # f0d0df ; }
.citation { font-family : Tahoma ; font-size : 12px ; couleur: # 9b6b6b ; line-height : 125% ; background-color : # ffffff ; border: # cfcdce ; border-style : solid; border: 1px # a08491 pointillé ; border-left -width: 1px ; border-top -width: 1px ; border-right -width: 1px ; border-bottom -width: 1px }
.code { font-family : Courier, Courier New , sans-serif ; font-size : 11px ; couleur: # 9b6b6b ; background-color : # ffffff ; border: # cfcdce ; border-style : solid; border-left -width: 1px ; border-top -width: 1px ; border-right -width: 1px ; border-bottom -width: 1px border: 1px # a08491 pointillé ; }
.statistiques{ border:0px; background-image: url("http://i28.servimg.com/u/f28/12/08/14/10/queel10.png"); background-repeat: no-repeat; background-position: top; height:270px;}
.groupes{ background-color:#FFFFFF;border: 1px #D0D0D0 dotted; -moz-border-radius : 5px 5px 5px 5px; height:40px; background-position: right; padding-right:12px; padding-left:12px; padding-bottom:3px; font-size:15px; font-weight: bold; text-align: center; text-decoration: none !important;}
.flou { background-color : # ccc ; / * couleur de l'ombre / couleur : inherit ; margin-left : 4px; margin-top : 4px; }
.ombre, .{ contenu position: relative; en bas: 2px ; droite: 2px ; }
.ombre { background-color : # 666 ; / * couleur de l'ombre / couleur : inherit ; }
.{ contenu background-color : # FFF ; / couleur de fond * de * contenu / color: # 000; / * couleur du texte du contenu * / border: 1px solid # 000 ; / * couleur de la bordure / padding : .5 em 2ex ; }
div.background { largeur: 500px ; Hauteur: 250px; border: 2px solid black ; } div.transbox { width: 400px; Hauteur: 180px ; margin: 50px 30px ; background-color : # ffffff ; border: 1px solid black ; filter: alpha ( opacity = 60) ; opacité: 0,6; } p div.transbox { margin: 40px 30px ; font- weight: bold ; color: # 000000 ; }
.blur{ background-color: #ccc; /*shadow color*/ color: inherit; margin-left: 4px; margin-top: 4px; }
.shadow, .content{ position: relative; bottom: 2px; right: 2px; }
.shadow{ background-color: #666; /*shadow color*/ color: inherit; }
.content{ background-image: URL("http://i28.servimg.com/u/f28/12/08/14/10/i_back10.gif"); /*background color of content*/ color: #000; /*text color of content*/ border: 1px solid #000; /*border color*/ padding: .5em 2ex; }
.titre { font-family: Monotype Corsiva, serif; /* Ceci est la police utilisée pour écrire votre titre. Il est conseillé de laisser serif à la fin, c'est la police par défaut (utilisée si les autres polices ne sont pas présentes sur les pc des personnes qui lisent les titres). */ font-size: 16px; /* Détermine la taille de la police. 100% est la taille normale, 110% est donc un peu plus grand */ background-color: #DDDDDD; /* Et pourquoi ne pas mettre une petite couleur en fond ? ça décore, ça fait sympa... xD */ border-bottom: 1px dashed #B39D9D; /* ça, c'est le "soulignement" du titre. Si vous voulez que ce soit un trait plein, remplacez "dashed" par "solid". Pour un trait en pointillé, c'est "dotted". Pour aucun trait du tout, c'est "j'efface la ligne". */ color: #999999; /* Couleur de la police ^^ */ text-align: center; /* C'est la classe si le titre est centré, mais on peut l'aligner à droite (right) ou à gauche (left). */ border-left: 5px solid #999999; /* ça, c'est pour faire les petites barres sur le côté du titre... Pour les faire plus large, il suffit de mettre 3px, 4px ou plus à la place de "1px" */ border-right: 5px solid #999999; width: 150px; }
.titre:hover { background-image: url(http://i28.servimg.com/u/f28/12/08/14/10/i_back10.png); background-repeat: repeat; color: #8f6e6e; border-left: 5px solid #8f6e6e; border-right: 5px solid #8f6e6e; border-bottom: 1px dashed #8f6e6e; }
.boite { overflow: auto; height: 100px; weight: 375px; padding: 10px; text-align: justify; border-bottom: 1px dashed #B39D9D; color: #999999; background-image: url(http://i28.servimg.com/u/f28/12/08/14/10/i_back10.png); background-repeat: repeat; border-left: 10px solid #999999; border: 10px solid #999999; }
a.infobulle { position: relative;
}
a.infobulle span { display: none; /* ceci masque l'infobulle */ } a.infobulle:hover { opacity: 0.5; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; background: none; /* correction d'un bug IE */ z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
} a.infobulle:hover span { display: inline; /* ceci affiche l'infobulle */ position: absolute; border: 1px solid #DDDDDD;
white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
top: 5px; /* on positionne notre infobulle */ left: 15px;
background: #DDDDDD; /* arrière-plan de l'infobulle */
color: #999999; /* texte dans l'infobulle */ padding: 3px;
/* bordures de votre infobulle*/ border: 1px dotted black; border-left: 1px dotted black; }
.messacc { background-image: URL("http://moe.mabul.org/up/moe/2010/07/28/img-171938nurla.png"); background-repeat: no-repeat;
}
.titrecategorie { color: #8f6e6e; border-bottom: 2px solid #CCCCCC; font-variant: small-caps; text-align: center; }
.titrecategorie:hover { border-bottom: 5px solid #CCCCCC; color: #999999; letter-spacing: 2px; }
/* FICHE */ .soulignage{ border-bottom: 2px solid #999999; /* la barre noir en dessous du nom & des infos */ }
.infoss{ word-spacing:10px; /* espace entre les mots pour les infos */ }
.boxcontenu { overflow:auto; height:360px; /* taille de la "box" */ padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:8px; text-align:justify; line-height:14px; font-size:12pt; border: 1px dashed #999999; /* encadrement de la "box" */ }
.postdetails.poster-profile a img { -moz-border-radius-bottomleft:10px; -moz-border-radius-bottomright:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px; border: 5px solid #999999; background-color: #CCCCCC; /*Le fond*/
}
.boitepointille { weight: 50px; width: 20% text-align: justify; color: #999999; border-left: 1px dashed #999999; border: 1px dashed #999999; }
a.infomessage { position: relative; color: #b39d9d; text-decoration: none; }
a.infomessage span { display: none; /* on masque l'infobulle */ font-size: 9px; }
a.infomessage:hover { background: none; /* correction d'un bug IE */ z-index: 999; /* on définit une valeur pour l'ordre d'affichage */ cursor: help; /* on change le curseur par défaut en curseur d'aide */ }
a.infomessage:hover span { /* on affiche l'infobulle */ display: inline; position: absolute; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */ top: 30px; /* on positionne notre infobulle */ left: 20px; padding: 3px; background: #DDDDDD; border: 3px solid #999999; color: #b39d9d; width: 220px }
.titreforum { background-color: #CCCCCC; padding-right:10px; padding-left:10px; padding-bottom: 3px; padding-top:3px; margin-left: 10px; } .titreforum:hover { background-color: #999999; padding-right:10px; padding-left:10px; padding-bottom: 3px; padding-top:3px; margin-left: 10px; border-left: 5px solid #8f6e6e; border-right: 5px solid #8f6e6e; }
a:hover { text-decoration: none !important; }
.sujets_messages { margin-top: 7px; /* pour faire un léger espace entre le bord et la ligne des "messages & sujets"; on évite de retirer */ padding: 3px; /* pour ne pas que le texte se colle aux bords du cadre; on évite de retirer */ padding-top: 12px; padding-bottom: 12px;
/* après on peut rajouter ce qu'on veut : une bordure, une image de fond ... */ border: 1px solid #999999; background-image: url(http://i28.servimg.com/u/f28/12/08/14/10/i_back10.png);}
.derniers_sujets { margin-top: 7px; /* pour faire un léger espace entre la ligne des "messages & sujets" et "dernier message posté", sinon ça se colle et c'est laid xD; on évite de retirer */*/ padding: 4px; /* pour ne pas que le texte se colle aux bords du cadre; on évite de retirer */*/ padding-top: 17px; padding-bottom: 17px;
/* après on peut rajouter ce qu'on veut : une bordure, une image de fond, un arrondi juste sur deux côtés ... */ border: 1px solid #999999; background-image: url(http://i28.servimg.com/u/f28/12/08/14/10/i_back10.png); -moz-border-radius-topleft: 10px; -moz-border-radius-bottomright: 10px;}
.couleurfondcate { background-image: url(http://i28.servimg.com/u/f28/12/08/14/10/i_back10.png); background-repeat: repeat; paddign-right: 5px; padding-left: 5px; }
.onglet { display: inline-block; margin-left: 3px; margin-right: 3px; padding: 3px; cursor: pointer; border: 2px solid #999999;
-moz-border-radius-bottomleft: 10px solid #999999; -moz-border-radius-bottomright: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px solid; } .onglet_0 { background:#bbbbbb; border-bottom:1px solid black; } .onglet_1 { background:#dddddd; border-bottom:0px solid black; padding-bottom:4px; } .contenu_onglet { background-color:#dddddd; border: 1px solid #999999; margin-top:-1px; display:none; }
.profil_contour { border-left: 4px dotted #999999; /*La bordure*/ border-right: 4px dotted #999999; background-color: #DDDDDD; /*Le fond*/ }
.titre_encadre { background-color: #843358; border-top: 3px solid #999999; border-bottom: 3px solid #999999; font-size: 12px } .titre_encadre:hover { border-left: 6px solid #424444; border-top: 2px dotted #424444; border-bottom: 2px dotted #424444; }
.titre_deco_charte { border-right: #993333 4px solid; border-bottom: #993333 2px dotted; letter-spacing : 2px; margin-right: 10px; font-family: trebuchet MS; }
.postbody { margin-left: 20px; }
PA - Spoiler:
- Code:
-
<table style="position: fixed; bottom: 40px; left: 0px;background-color: #ffffff;z-index:10000;"><tr><td><iframe src="/chatbox/chatbox.forum?page=front&" id="chatboxpop" scrolling="no" style="width: 550px; height: 350px; display: none;" marginwidth="0" marginheight="0" frameborder="0"></iframe></td><td style="vertical-align: bottom;"><img src="http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png" onClick="document.getElementById('chatboxpop').style.display=(this.src=='http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png')?'block':'none';this.src=(this.src=='http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png')?'http://i81.servimg.com/u/f81/11/21/85/73/fermer10.png':'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png';"/></td></tr></table><div class="messacc"><DIV style="TEXT-ALIGN: center; MARGIN: auto; WIDTH: 100%"><IMG border=0 alt="" src="http://moe.mabul.org/up/moe/2010/07/20/img-234937viotp.png"></DIV><div class="titre_encadre">Forum optimisé pour Internet Explorer 7</div> <br> </br> <br> </br>
<table style="border-collapse:collapse; background="http://moe.mabul.org/up/moe/2010/07/21/img-182752fk6c2.png";> <tr> <td width="40%"><div style="margin:auto; text-align: center; width:100%"><img src="http://i38.servimg.com/u/f38/12/08/14/10/sans_t14.png" border="0" alt="" /><div class="titre"><div><a href="http://gakuen-yokotsui.forumactif.com/charte-du-pensionnat-f1/la-charte-t1.htm" target="_blank">Charte</a></div></div><div class="titre"><div><a href="http://gakuen-yokotsui.forumactif.com/charte-du-pensionnat-f1/les-groupes-t2.htm" target="_blank">Groupes</a></div></div><div class="titre"><div><a href="http://gakuen-yokotsui.forumactif.com/dossiers-des-pensionnaires-f2/fiche-type-des-dossiers-a-respecter-t4.htm#4" target="_blank">Présentation</a></div></div><div class="titre"><div><a href="http://gakuen-yokotsui.forumactif.com/les-vacants-cie-f5/avatars-pris-t5.htm" target="_blank">Avatars Pris</a></div></div></div></div></td> <td width="27%"><div class="boite"> Bonjour à vous ~ J'espère que vous allez vous plaire au Pensionnat Yokotsui ♥ Oui, vous ! Jeunes gens qui n'ont peut-être pas les moyens de s'offrir une vie, venez à Yokotsui, où vous serez hébergés, nourris et scolarisés ! Vous, qui êtes humain, vampire, démon, elfe, etc ... Vous qui avez des «dons», venez vous exercer et surtout vivre à Yokotsui ! En plus, l'école comporte trois classes ! Incrustez-vous dans un groupe et venez vous amusez vous aussi ! Attention, le secret de Yokotsui est que les étudiants peuvent avoir un «servant» qui lui obéira complètement, hum hum ... Attention de ne pas vous faire violenter ~ ♥ Forum autorisant le Yaoi-Yuri-Hentai-Hard </div></td> <td> <br><div><a href="http://gakuen-yokotsui.forumactif.com/charte-du-pensionnat-f1/le-staff-no-life-t3.htm" target="_blank"><img src="http://i38.servimg.com/u/f38/12/08/14/10/sans_t12.png" border="0" alt="" /></a></div></br> <a href="#" class="infobulle"><img src="http://img412.imageshack.us/img412/966/gen1s.png"></img> <span> Hachi Takade <br><img src="http://img135.imageshack.us/img135/351/gen2.png"></img></br> ♫ Fonda' ♥ </span>
<a href="#" class="infobulle"><img src="http://img409.imageshack.us/img409/9902/genji1.png"></img> <span> Genji Serizawa <br><img src="http://img819.imageshack.us/img819/8247/genji2.png"></img></br> Admin ♥ </span></td> </tr> </table>
<table> <tr> <td style="width: 450px"> <br> </br> <br> </br> <br> </br><div style="height: 200px"><div class="systeme_onglets"><div class="onglets"> <span class="onglet_0 onglet" id="onglet_staff" onmouseover="javascript:change_onglet('staff');">°.: News</span> <span class="onglet_0 onglet" id="onglet_news" onmouseover="javascript:change_onglet('news');">Copyright</span> <span class="onglet_0 onglet" id="onglet_partenaires" onmouseover="javascript:change_onglet('partenaires');">Prédéfinis ♥</span> </div><div class="contenu_onglets"><div class="contenu_onglet" id="contenu_onglet_staff"><div style="font-family: trebuchet MS; color: #999999; font-size: 15px"><ul><div style="text-align: justify; padding-left: 10px; padding-right: 20px">• Seuls les membres validés pourront voir le contenu du RPG, car il pourrait y avoir des textes ou images pouvant heurtés la sensibilité des plus jeunes ~ Si vous vous inscrivez ici, c'est donc en complète connaissance de cause et vous seul serez responsable si vous vous retrouvez choqué ou autre. Merci de votre compréhension ♥</div></ul></div></div><div class="contenu_onglet" id="contenu_onglet_news"><div style="font-family: Trebuchet MS; color: #999999; font-size: 15px"><ul><div style="text-align: justify; padding-left: 10px; padding-right: 20px">©Gakuen Yokotsui. Toutes reproductions entières ou partielles sont totalement interdites. Le graphisme, design, les idées, et tout le reste ont été fait par les admins de ce forum seulement et pour ce forum seulement.</div></ul></div></div><div class="contenu_onglet" id="contenu_onglet_partenaires"> <a href="#" class="infobulle"><img src="http://i28.servimg.com/u/f28/12/08/14/10/pradef11.png" border="0" alt="" /> <span><font color="black"> <br>• Lunari Tachi <br>• 1ère année <br>• Sportive » Tennis</font> <a href="http://gakuen-yokotsui.forumactif.com/les-vacants-cie-f5/personnages-predefinis-t6.htm">Voila Intéressé ? ♥ </span></a></a> </div> </div> </div> </div> <script type="text/javascript"> //<!-- var anc_onglet = 'staff'; change_onglet(anc_onglet); //--> </script> </td>
<td align="center"> <br> </br> <br> </br><div style="margin-left: 70px"><img src="http://i38.servimg.com/u/f38/12/08/14/10/sans_t13.png" border="0" alt="" /></div> <br><div align="center"><marquee style="width: 100px; height: 50px" direction="up" onmouseover=this.stop(); onmouseout=this.start();></br> <br><a href="http://gakuen-yokotsui.forumactif.com/partenaires-f9/nos-partenaires-t7.htm#7"><img src="http://i38.servimg.com/u/f38/12/08/14/10/you10.png"></a></br> <br><a href="URL DU LIEN"><img src="LIEN IMAGE"></a></br> <br><a href="URL DU LIEN"><img src="LIEN IMAGE"></a></br> <br><a href="URL DU LIEN"><img src="LIEN IMAGE"></a></br> </marquee></div> </td> </tr>
</table></div>
| | |
| | | Imari
{ Membre hyper-actif }
Messages : 1538
| Bonjour,
Le problème est-il résolu ? | | |
| | | Katara
{ Membre }
Messages : 32
| Bonjour, non, le problème n'est pas résolu =) | | |
| | | Sui
{ Membre actif }
Messages : 346
| Est-ce que ça serait une différence de navigateur ou juste un bug ? (: | | |
| | | Katara
{ Membre }
Messages : 32
| Non aucun bug, et on a le même navigateur :s | | |
| | | Invité Invité
| Bonjour, Votre problème est-il résolu ? Si oui, merci de cocher dans "icône du sujet" l'icône en éditant votre premier post. | | |
| | | Katara
{ Membre }
Messages : 32
| Le premier est résolu, mais le défilement d'image se stoppe toujours. | | |
| | | Murtagh
{ Modérateur }
Messages : 1492
| Le problème étant résolu, je déplace. | | |
| | | Contenu sponsorisé
| | | | | Problème de position dans la PA | |
|
Sujets similaires | |
|
| Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|