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! |
| AN.
{ Membre }
Messages : 3
| Bonsoiir ♫ Vous vous souvenez de moi ? Non, impossible. Enfin OSEF, place au problème /o/
J'ai créé un forum il y a peu, dont voici l'adresse : http://street-warriors.forumactif.com/forum.htm Mise en page soignée, bidouillage du feuillage CSS et des templates... En bref, tout va bien jusqu'à regarder la page d'accueil de plus près. En effet, j'ai utilisé un code pour le Staff ; mais les Infobulles, au lieu de n'apparaître qu'au passage de la souris, réapparaissent à gauche de l'écran ! Je ne prends pas la peine de screener puisqu'apparemment tout le monde peut le voir, et j'utilise ce code sur un autre forum où je ne rencontre aucun bug de ce genre. Si besoin, voilà mon feuillage CSS (je m'excuse de la longueur ^^" Allez tout en bas pour le code infobulle) : - Code:
-
body { background-repeat: no-repeat; background-position: top center; }
a {text-decoration: none;} a:link {text-decoration: none;} a:hover {text-decoration: none!important;} a.forumlink {text-decoration: none;} a.forumlink:hover {text-decoration: none!important;} a.topiclink {text-decoration: none; } a.topiclink:hover {text-decoration: none!important; }
.forumline { -moz-border-radius:15px; Border-top:1px solid #d1d1d3; border-bottom:1px solid #d1d1d3; border-left:10px solid #d1d1d3; border-right:10px solid #d1d1d3; }
tr.post span.gensmall { display: none; }
#chatbox_members ul li, body.chatbox { background-image:url('http://i45.tinypic.com/2dhia94.png'); background-repeat: repeat; }
.forumline{ border: 3px #ccc785 double; } .opacity img { filter:alpha(opacity=50); -moz-opacity:0.5;opacity: 0.5; }
.opacity img:hover { filter:alpha(opacity=100); -moz-opacity:1;opacity: 1; }
body { cursor: crosshair } a:hover { cursor: crosshair }
td.row1{
background-image: url("http://i45.tinypic.com/2dhia94.png"); } td.row2{ background-image: url("http://i45.tinypic.com/2dhia94.png"); } td.row3{ background-image: url("http://i45.tinypic.com/2dhia94.png"); }
u{border-bottom: 1px solid;border-color:#B0ADA0;text-decoration: none; -moz-border-radius:6px;}
I{border-bottom:none; color:#3F4251;text-decoration: none }
a:hover { text-decoration: none ; color: black ; border-bottom: 1px dotted #B0ADA0; }
.bodylinewidth { width:70%}
a img { border: none; }
a.mainmenu{ text-decoration: none; color : #000000; } a.mainmenu:hover{ text-decoration: none; color : #B0ADA0; }
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:hover{text-transform:uppercase;}
.quote{ font-family: Tahoma; font-size: 12px; color: #000000; line-height: 125%; background-color: #CCC785; border: #cfcdce; border-style: solid; border: 1px #a08491 dotted; 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: #000000; background-color: #CCC785; border: #cfcdce; border-style: solid; border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px border: 1px #a08491 dotted; -moz-border-radius:6px;}
.forumline{ background-color: #7A5E5E; -moz-border-radius: 0px 0px 14px 14px ; border-bottom: 6px #7A5E5E solid; border-top: 1px #7A5E5E dotted; border-right: 1px #7A5E5E dotted; border-left: 1px #7A5E5E dotted;}
a.forumlink:hover, a.forumlink:hover:visited{ background-color: #7A5E5E; border-left: 9px solid #7A5E5E; border-right: 9px solid #7A5E5E; -moz-border-radius:15px;}
a.mainmenu:link, a.mainmenu:visited{ margin-left : 6px; margin-right : 6px; font-family :Georgia; color: #818181; background-image: url("http://i45.tinypic.com/2dhia94.png"); text-align:left; border-left: 6px solid #C9BAAB; border-right: 9px solid: url("http://i45.tinypic.com/2dhia94.png"); }
a.mainmenu:hover, a.mainmenu:hover:visited{ color: #908789; border-left: 6px solid #7A5E5E; border-right: 9px solid: url("http://i45.tinypic.com/2dhia94.png"); }
a {font-variant: small-caps;}
.statistiques{ border:0px; background-image: url("http://i49.tinypic.com/2evenfs.jpg"); background-repeat: no-repeat; background-position: center; height:270px;}
.groupes{ background-image: url("http://i45.tinypic.com/2dhia94.png");border: 1px #D0D0D0 dotted; -moz-border-radius : 5px 5px 5px 5px; height:40px;padding-right:12px;padding-left:14px;padding-bottom:3px; font-size:15px;font-weight: bold;text-align:center; text-decoration: none !important;}
.tstaff{ font-size:1em; }
.thumbnail{ position: relative; z-index: 0; }
.thumbnail:hover{ background-image: url("http://i46.tinypic.com/35m49oy.png"); z-index: 50; }
.thumbnail span{ position: absolute; background-image: url("http://i46.tinypic.com/35m49oy.png"); padding: 5px; left: -1000px; border: 1px #D0D0D0 dotted; visibility: visible; color: #000000; text-decoration: none; }
.thumbnail span img{ border: 1px groove; padding: 2px; }
.thumbnail:hover span{ visibility: visible; top: 50px; left: 25px; /*position where enlarged image should offset horizontally */ width: 160px } Merci d'avance à ceux qui prendront la peine de répondre et de m'aider. | | |
| | | Thalie
{ Membre actif }
Messages : 317
| On peu avoir le code de ta page d'accueil aussi s'il te plait. | | |
| | | AN.
{ Membre }
Messages : 3
| - Code:
-
[center]<div style="background:#3F4251;">[size=24][font=Georgia]Welcome in the Warriors City.[/font][/size]</div>[/center]<br> <br> <table><tr><td><div style="background:#3F4251;">[center][size=18][font=Georgia]Street Warriors.[/font][/size][/center]</div><br> [list][justify][size=11]Lion, Tigre et Léopard. Tonnerre, Ombre, Rivière et Vent. Et aujourd'hui ? ... Foudre, Ombres, Source et Mistral. Suite à la prophétie de Minuit et au départ des quatre Clans, seuls sont restés quelques guerriers qui, rejoints par des chats errants et des solitaires, ont décidé de faire renaître le phénix malgré la destruction de la forêt. Désormais, il n'y a plus de place que pour Bipèdes, béton et pollution. Les Ancêtres semblent avoir abandonné leurs protégés, mais les nouveaux Clans vont tout de même s'adapter à un environnement certes nouveau, mais tout aussi dangereux... voire plus ? [url=http://street-warriors.forumactif.com/contexte-f3/histoire-t13.htm]Suite[/url][/size][/justify][/list]<br> </td><td><div style="background:#3F4251;">[center][size=18][font=Georgia]News.[/font][/size][/center]</div><br> [list][justify][size=11]Le forum devrait ouvrir sous peu ![/size][/justify][/list]<br> </td></tr><tr><td><div style="background:#3F4251;">[center][size=18][font=Georgia]On the Town...[/font][/size][/center]</div><br> [list][justify][size=11]Les Clans viennent de s'installer en ville...<br> <br> Le [color=#4F0505]Clan des Ombres[/color] voit désormais à sa tête un ancien solitaire désormais appelé [i]Étoile du Baron[/i] ; il a nommé [i]Comptine d'Été[/i] pour le seconder. Dans le [color=#0D3A0D]Clan de la Foudre[/color], c'est [i]Étoile du Vent[/i], un guerrier certes jeune mais prometteur, qui a pris la relève. Du côté du [color=#003A49]Clan de la Source[/color], [i]Étoile Arctique[/i] est la nouvelle meneuse. Quant au [color=#2F214D]Clan du Mistral[/color], le nouveau chef n'est autre que [i]Étoile du Requiem[/i].[/size][/justify][/list]<br> </td><td><div style="background:#3F4251;">[center][size=18][font=Georgia]Links.[/font][/size][/center]</div><br> [list][size=11][url=http://street-warriors.forumactif.com/reglement-f1/reglement-du-forum-du-jeu-t12.htm]http://[/url] règlement<br> [url=http://street-warriors.forumactif.com/contexte-f3/histoire-t13.htm]http://[/url] histoire<br> [url=http://street-warriors.forumactif.com/contexte-f3/fonctionnement-des-clans-t40.htm#192]http://[/url] fonctionnement des clans<br> [url=http://street-warriors.forumactif.com/presentation-f21/effectifs-t44.htm]http://[/url] effectifs<br> [url=http://street-warriors.forumactif.com/presentation-f21/]http://[/url] présentation<br> [url=http://street-warriors.forumactif.com/coin-des-invites-f8/]http://[/url] invité ?<br>[/size][/list]<br> </td></tr><tr><td><div style="background:#3F4251;">[center][size=18][font=Georgia]Weather.[/font][/size][/center]</div><br> [list][justify][size=11][b]Hiver.[/b]<br> [i]Oh, it's raining again...[/i]<br> La saison des neiges laisse peu à peu la place à celle des feuilles vertes ; et si les arbres restent dénudés, on sent nettement le réchauffement dans l'air. Le ciel enchaîne averses et matinées ensoleillées.[/size][/justify][/list]<br> </td><td><div style="background:#3F4251;">[center][size=18][font=Georgia]Staff.[/font][/size][/center]</div><br> [list][justify][size=11]<div class="thumbnail"><img src="http://i46.tinypic.com/15mjm0i.png" border="0"><span><div class="tstaff">[center]<img src="http://img262.imageshack.us/img262/2231/brigand.png" " border="0"><br> <font color=cadetblue><b>A.N. O'Nyme</b></font> (Étoile du Baron) [i]Fondatrice.[/i]<br> <a href="http://street-warriors.forumactif.com/profile.forum?mode=viewprofile&u=1">Profil</a> <a href="http://street-warriors.forumactif.com/msg.forum?mode=post&u=1">MP</a>[/center]</div></span></div><br> <div class="thumbnail"><img src="http://i45.tinypic.com/2h3c45k.png" border="0"><span><div class="tstaff">[center]<img src="http://img217.imageshack.us/img217/5148/eclat3.png" " border="0"><br> <font color=cadetblue><b>TicTacToe</b></font> (Étoile Arctique) [i]Modératrice.[/i]<br> <a href="http://street-warriors.forumactif.com/profile.forum?mode=viewprofile&u=4">Profil</a> <a href="http://street-warriors.forumactif.com/msg.forum?mode=post&u=4">MP</a>[/center]</div></span></div><br> <div class="thumbnail"><img src="http://i48.tinypic.com/15nvnmv.png" border="0"><span><div class="tstaff">[center]<img src="http://i50.tinypic.com/m9rvd0.png" " border="0"><br> <font color=cadetblue><b>Tykasu</b></font> (Étoile du Requiem) [i]Modératrice.[/i]<br> <a href="http://street-warriors.forumactif.com/profile.forum?mode=viewprofile&u=2">Profil</a> <a href="http://street-warriors.forumactif.com/msg.forum?mode=post&u=2">MP</a>[/center]</div></span></div><br>[/justify][/size][/list]</td></tr><tr><td><div style="background:#3F4251;">[center][size=18][font=Georgia]Stats.[/font][/size][/center]</div><br> [list][justify][size=11][color=#4F0505]Clan des Ombres[/color] : Ouvert.<br> [color=#0D3A0D]Clan de la Foudre[/color] : Ouvert. [u]Recherche[/u] : Lieutenant, Guérisseur, Apprenti-guérisseur.<br> [color=#003A49]Clan de la Source[/color] : Ouvert. [u]Recherche[/u] : Lieutenant, Guérisseur, Apprenti-guérisseur.<br> [color=#2F214D]Clan du Mistral[/color] : Ouvert. [u]Recherche[/u] : Guérisseur, Apprenti-guérisseur.<br> [color=black]Solitaires[/color] : Ouvert.[/size][/justify][/list]<br> <br> </td><td><div style="background:#3F4251;">[center][size=18][font=Georgia]Friends.[/font][/size][/center]</div><br> [list][justify][size=11][url=http://alchimy.forumactif.com/][img]http://i45.tinypic.com/2rwkr9c.gif[/img][/url]<br><br>[url=http://street-warriors.forumactif.com/publicite-f12/partenaires-t73.htm#617]Plus ?[/url] [url=http://street-warriors.forumactif.com/coin-des-invites-f8/demandes-de-partenariat-t5.htm]Vous ?[/url][/size][/justify][/list]</td></tr></table><table><tr><div style="background:#3F4251;">[center][size=18][font=Georgia]Credits.[/font][/size][/center]</div><br>[center][size=11]Forum créé par A.N. O'Nyme (Étoile du Baron), tous droits réservés<br> <i>« tu touches, jte bouffe »</i>[/size][/center]</tr></table> Voilà :] | | |
| | | Invité Invité
| Le problème venait de ton CSS car dans .thumbnail span tu avais mis l'infobulle visible alors qu'elle doit être cachée - Code:
-
body { background-repeat: no-repeat; background-position: top center; }
a {text-decoration: none;} a:link {text-decoration: none;} a:hover {text-decoration: none!important;} a.forumlink {text-decoration: none;} a.forumlink:hover {text-decoration: none!important;} a.topiclink {text-decoration: none; } a.topiclink:hover {text-decoration: none!important; }
.forumline { -moz-border-radius:15px; Border-top:1px solid #d1d1d3; border-bottom:1px solid #d1d1d3; border-left:10px solid #d1d1d3; border-right:10px solid #d1d1d3; }
tr.post span.gensmall { display: none; }
#chatbox_members ul li, body.chatbox { background-image:url('http://i45.tinypic.com/2dhia94.png'); background-repeat: repeat; }
.forumline{ border: 3px #ccc785 double; } .opacity img { filter:alpha(opacity=50); -moz-opacity:0.5;opacity: 0.5; }
.opacity img:hover { filter:alpha(opacity=100); -moz-opacity:1;opacity: 1; }
body { cursor: crosshair } a:hover { cursor: crosshair }
td.row1{
background-image: url("http://i45.tinypic.com/2dhia94.png"); } td.row2{ background-image: url("http://i45.tinypic.com/2dhia94.png"); } td.row3{ background-image: url("http://i45.tinypic.com/2dhia94.png"); }
u{border-bottom: 1px solid;border-color:#B0ADA0;text-decoration: none; -moz-border-radius:6px;}
I{border-bottom:none; color:#3F4251;text-decoration: none }
a:hover { text-decoration: none ; color: black ; border-bottom: 1px dotted #B0ADA0; }
.bodylinewidth { width:70%}
a img { border: none; }
a.mainmenu{ text-decoration: none; color : #000000; } a.mainmenu:hover{ text-decoration: none; color : #B0ADA0; }
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:hover{text-transform:uppercase;}
.quote{ font-family: Tahoma; font-size: 12px; color: #000000; line-height: 125%; background-color: #CCC785; border: #cfcdce; border-style: solid; border: 1px #a08491 dotted; 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: #000000; background-color: #CCC785; border: #cfcdce; border-style: solid; border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px border: 1px #a08491 dotted; -moz-border-radius:6px;}
.forumline{ background-color: #7A5E5E; -moz-border-radius: 0px 0px 14px 14px ; border-bottom: 6px #7A5E5E solid; border-top: 1px #7A5E5E dotted; border-right: 1px #7A5E5E dotted; border-left: 1px #7A5E5E dotted;}
a.forumlink:hover, a.forumlink:hover:visited{ background-color: #7A5E5E; border-left: 9px solid #7A5E5E; border-right: 9px solid #7A5E5E; -moz-border-radius:15px;}
a.mainmenu:link, a.mainmenu:visited{ margin-left : 6px; margin-right : 6px; font-family :Georgia; color: #818181; background-image: url("http://i45.tinypic.com/2dhia94.png"); text-align:left; border-left: 6px solid #C9BAAB; border-right: 9px solid: url("http://i45.tinypic.com/2dhia94.png"); }
a.mainmenu:hover, a.mainmenu:hover:visited{ color: #908789; border-left: 6px solid #7A5E5E; border-right: 9px solid: url("http://i45.tinypic.com/2dhia94.png"); }
a {font-variant: small-caps;}
.statistiques{ border:0px; background-image: url("http://i49.tinypic.com/2evenfs.jpg"); background-repeat: no-repeat; background-position: center; height:270px;}
.groupes{ background-image: url("http://i45.tinypic.com/2dhia94.png");border: 1px #D0D0D0 dotted; -moz-border-radius : 5px 5px 5px 5px; height:40px;padding-right:12px;padding-left:14px;padding-bottom:3px; font-size:15px;font-weight: bold;text-align:center; text-decoration: none !important;}
.tstaff{ font-size:1em; }
.thumbnail{ position: relative; z-index: 0; }
.thumbnail:hover{ background-image: url("http://i46.tinypic.com/35m49oy.png"); z-index: 50; }
.thumbnail span{ position: absolute; background-image: url("http://i46.tinypic.com/35m49oy.png"); padding: 5px; left: -1000px; border: 1px #D0D0D0 dotted; display: none; /* on masque l'infobulle */ color: #000000; text-decoration: none; }
.thumbnail span img{ border: 1px groove; padding: 2px; }
.thumbnail:hover span{ display: inline; /* on affiche l'infobulle */ top: 50px; left: 25px; /*position where enlarged image should offset horizontally */ width: 160px } | | |
| | | Thalie
{ Membre actif }
Messages : 317
| Fait attention aussi dans ton code html, même si ca ce voit pas ensuite dans l'affiche, ya des fautes dedans. Et il faut aussi éviter de mélanger le code de forum actif et le html normal | | |
| | | AN.
{ Membre }
Messages : 3
| Kimy; Oh, merci beaucoup x) Thalie; Ah mais si je suis déjà moyenne en CSS, alors en HTML je suis au plus bas ^^" Moi, c'est à la bonne franquette : tant que les erreurs ne se voient pas /o/ | | |
| | | Contenu sponsorisé
| | | | |
Sujets similaires | |
|
| Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|