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 CSS et page html | |
| Anthocyane
{ Membre }
Messages : 17
| Bien le bonjour/bonsoir à tous ! J'ai un petit problème... Je voulais faire une jolie fiche de pub que je pourrais poster sur tous les autres forum, tout en conservant le CSS de mon forum. Cela, je l'ai réussi en partie. En fait j'ai fait une page html sur mon forum et dans le < head > j'ai mis du CSS. Ensuite, il ne me reste plus qu'à pulier sur un autre forum n'ayant pas le même CSS que moi et j'ai quand même l'effet voulu : Code html de la page : - Spoiler:
- Code:
-
<head> <title>Fiche Pub Aventures</title>
<style type="text/css">
/*liens*/
a:link, a:active, a:visited { color: #032E54; text-decoration: none !important; font-style: italic; }
a:hover { text-decoration: none !important; color: #3186CC; }
.predefti { background-color : #D9BD86; border: 1px dashed #D9BD86; border-left: 1px dashed #D9BD86; border-right: 1px dashed #D9BD86; border-top: 1px dashed #D9BD86; border-bottom: 1px dashed #D9BD86; -moz-border-radius: 15px; width: 80%; }
.predef { background-color : #D9BD86; border: 1px dashed #D9BD86; border-left: 1px dashed #D9BD86; border-right: 1px dashed #D9BD86; border-top: 1px dashed #D9BD86; border-bottom: 1px dashed #D9BD86; -moz-border-radius: 15px; width: 90%; }
.predefpub { overflow: auto; height: 400px; border: 1px solid #D9BD86; -moz-border-radius: 15px; padding: 3px; }
.menu { -moz-border-radius-bottomleft:15px; -moz-border-radius-bottomright:15px; background-color : #D9BD86; text-align: justify; }
.menuliendr { -moz-border-radius-bottomright:15px; -moz-border-radius-topright:15px; border-left: 3px solid #E8D5A7; border-right: 2px dashed #E8D5A7; border-top: 1px dashed #E8D5A7; border-bottom: 1px dashed #E8D5A7; padding: 0px 5px 0px 3px; /*haut droit bas gauche dedans*/ }
.menuliendr:hover { -moz-border-radius-bottomright:15px; -moz-border-radius-topright:15px; border-left: 7px solid #E8D5A7; border-right: 2px dashed #E8D5A7; border-top: 1px dashed #E8D5A7C; border-bottom: 1px dashed #E8D5A7; padding: 0px 5px 0px 3px; background-color : #E8D5A7; }
.menulienga { -moz-border-radius-bottomleft:15px; -moz-border-radius-topleft:15px; border-right: 3px solid #E8D5A7; border-left: 2px dashed #E8D5A7; border-top: 1px dashed #E8D5A7; border-bottom: 1px dashed #E8D5A7; padding: 0px 3px 0px 5px; }
.menulienga:hover { -moz-border-radius-bottomleft:15px; -moz-border-radius-topleft:15px; border-right: 7px solid #E8D5A7; border-left: 2px dashed #E8D5A7; border-top: 1px dashed #E8D5A7; border-bottom: 1px dashed #E8D5A7; padding: 0px 3px 0px 5px; background-color : #E8D5A7; }
</style>
</head>
<body>
<center> <br> <div class="predefti"><span style="font-size: 18px; line-height: normal"><font face="Georgia"><i><strong><font color="#E8D5A7">Aventures</font></strong></i></font></span><br> <a href="http://aventures.forum-actif.net/" class="postlink" target="_blank">http://aventures.forum-actif.net/</a></div> <br><br> <div class="predef"><table><tr><td colspan=2><div align="justify">Dans ce forum il y a des Aventures où chaque personnage apporte une pierre qui permettra de construire une histoire à part entière.</div></td></tr><tr><td width=250><center><img src="http://i69.servimg.com/u/f69/13/59/02/22/pub110.jpg"><center></td> <td><div align="justify"> Chaque Aventure débute avec une petite introduction expliquant brièvement l’univers dans laquelle elle se déroule ainsi que la personne qui va proposer une Quête. Et à côté de cela il peut y avoir une carte du pays où va se dérouler l’Aventure, quelques légendes importantes à l’histoire, tout ça dans le but de faire un peu plus partager l’univers de l’Aventure. Seulement un peu, car l’un des objectifs de ce forum est que les joueurs s’approprient le monde et l’univers et qu’ils créent ce qui leur semble important pour l’Aventure. Lorsqu’ils seront en route c’est à eux de décider quand il y aura une auberge ou une attaque de bandits. Dieu n’intervenant que pour donner des situations exceptionnelles. C’est donc aux joueurs de créer l’Aventure et de décider quand viendra la fin de leur Quête. Car chaque Aventure a un début et une fin, mais cela ne signifie pas la fin du personnage, car il pourra toujours s’inscrire dans une autre Aventure et ainsi apporter ses qualités et ses défauts aux autres personnages présents et ainsi rendre l’histoire plus attractive. Car ce qui est intéressant c’est de mettre des personnages d’origines et de caractères différents ensemble et de voir ce qu’ils vont réussir à produire tout au long de l’accomplissement de la Quête.</div></td></tr><tr><td colspan=2><div align="justify">Imaginez une fillette, boule d’énergie et de bonheur avec un homme dur et insensible ayant parfois des crises de folies le tout sur un bateau, on dirait le début d'une blague, mais non, c'est Aventures !</div></td></tr></table> </div> <br><br> <div class="predef"><div align="justify">Les Aventures peuvent se dérouler dans différents univers, médiéval-fantastique, pirates, ou conte de fée… Et chaque Aventure regroupe cinq personnages. Un joueur qui a son personnage inscrit dans l’un de ces Aventures va devoir imaginer et faire avancer l’Aventure. Pour cela il va se servir de récits à la première personne du singulier, concernant bien évidemment les pensées de son personnage. Ces récits peuvent alors avoir plusieurs formes, pensées prises sur le vif, exemple : <i>"Je vis tous à coup une monstrueuse mente religieuse apparaître, je demandais alors au chef de notre troupe ce qu’il fallait faire. Il me répondit que si je n’avais pas d’insecticide sur moi, il fallait mieux fuir le plus vite possible."</i> Ou alors sous la forme d’un journal intime, exemple : <i>"Aujourd’hui notre troupe s’est fait attaqué par une monstrueuse mente religieuse, et même dans ces cas là notre incroyable chef a trouvé le moyen de plaisanter. Mais nous avons tout de même dû fuir comme des lâches."</i> Avec ces récits à la première personne il est possible de faire de brefs passages à la troisième personne, type narrateur omniscient, pour décrire ce que le personnage ne pourrait pas décrire, exemple : <i>"La mente religieuse, repu du repas de son dernier mâle ne prêta aucune attention aux petits humains qu’elle rencontra, elle tout ce qu’elle cherchait, c’était un endroit pour digérer."</i> Une fois qu’un joueur a écrit sa réponse, il ajoute à la fin de son post le nom du personnage qui va devoir continuer l’histoire. En bref, il y a vraiment de quoi s'amuser dans Aventures !</div></div> <br><br> <div class="predef">Si maintenant vous avez envie de vous laisser tenter par l'aventure, voici quelques liens qui pourront vous être utiles :<br> <table> <tr> <td border="0" align="right" width="195"> <span class="menulienga"><a href="http://aventures.forum-actif.net/principe-reglement-f1/principe-du-jeu-t1.htm">Principe du Jeu</a></span><br> <span class="menulienga"><a href="http://aventures.forum-actif.net/principe-reglement-f1/reglement-t2.htm">Règlement</a></span><br> <span class="menulienga"><a href="http://aventures.forum-actif.net/Aventures-h1.htm">Aventures</a></span><br> <span class="menulienga"><a href="http://aventures.forum-actif.net/presentations-f42/">Présentations</a></span><br> <span class="menulienga"><a href="http://aventures.forum-actif.net/personnages-predefinis-f25/">Personnages Prédéfinis</a></span> </td> <td border="0" width="5"><font color="#E8D5A7">.</font> </td> <td border="0" width="195"> <span class="menuliendr"><a href="http://aventures.forum-actif.net/principe-reglement-f1/guide-de-l-aventurier-t213.htm#727">Guide de l'Aventurier</a></span><br> <span class="menuliendr"><a href="http://aventures.forum-actif.net/partenariats-f6/">Partenariat</a></span><br> <span class="menuliendr"><a href="http://aventures.forum-actif.net/gestion-des-personnages-f34/celebrites-deja-prises-en-avatar-t58.htm">Célébrités prises</a></span><br> <span class="menuliendr"><a href="http://aventures.forum-actif.net/commandes-et-propositions-f38/propositions-d-avatars-t61.htm>Proposition d'Avatar</a></span><br> <span class="menuliendr"><a href="http://aventures.forum-actif.net/principe-reglement-f1/peronnage-secondaire-t176.htm">Peronnage secondaire</a></span><br> <span class="menuliendr"><a href="http://aventures.forum-actif.net/jeux-rp-f4/">Jeux RP</a></span> </td> </tr> </table></div> <br><br> <div class="predef"><table><tr><td width= 210 height=400><img src="http://i89.servimg.com/u/f89/13/59/02/22/roderi11.jpg"></td><td><div class="predefpub">Chaque Aventure débute avec une petite introduction expliquant brièvement l’univers dans laquelle elle se déroule ainsi que la personne qui va proposer une Quête. Et à côté de cela il peut y avoir une carte du pays où va se dérouler l’Aventure, quelques légendes importantes à l’histoire, tout ça dans le but de faire un peu plus partager l’univers de l’Aventure. Seulement un peu, car l’un des objectifs de ce forum est que les joueurs s’approprient le monde et l’univers et qu’ils créent ce qui leur semble important pour l’Aventure. Lorsqu’ils seront en route c’est à eux de décider quand il y aura une auberge ou une attaque de bandits. Dieu n’intervenant que pour donner des situations exceptionnelles. C’est donc aux joueurs de créer l’Aventure et de décider quand viendra la fin de leur Quête. Car chaque Aventure a un début et une fin, mais cela ne signifie pas la fin du personnage, car il pourra toujours s’inscrire dans une autre Aventure et ainsi apporter ses qualités et ses défauts aux autres personnages présents et ainsi rendre l’histoire plus attractive. Car ce qui est intéressant c’est de mettre des personnages d’origines et de caractères différents ensemble et de voir ce qu’ils vont réussir à produire tout au long de l’accomplissement de la Quête.
Chaque Aventure débute avec une petite introduction expliquant brièvement l’univers dans laquelle elle se déroule ainsi que la personne qui va proposer une Quête. Et à côté de cela il peut y avoir une carte du pays où va se dérouler l’Aventure, quelques légendes importantes à l’histoire, tout ça dans le but de faire un peu plus partager l’univers de l’Aventure. Seulement un peu, car l’un des objectifs de ce forum est que les joueurs s’approprient le monde et l’univers et qu’ils créent ce qui leur semble important pour l’Aventure. Lorsqu’ils seront en route c’est à eux de décider quand il y aura une auberge ou une attaque de bandits. Dieu n’intervenant que pour donner des situations exceptionnelles. C’est donc aux joueurs de créer l’Aventure et de décider quand viendra la fin de leur Quête. Car chaque Aventure a un début et une fin, mais cela ne signifie pas la fin du personnage, car il pourra toujours s’inscrire dans une autre Aventure et ainsi apporter ses qualités et ses défauts aux autres personnages présents et ainsi rendre l’histoire plus attractive. Car ce qui est intéressant c’est de mettre des personnages d’origines et de caractères différents ensemble et de voir ce qu’ils vont réussir à produire tout au long de l’accomplissement de la Quête.</div></td></tr></table></div> </center>
</body> </html>
Cela fonctionne presque entièrement, il y a juste les liens utiles, au milieu de la fiche, normalement quand on passe dessus il y a un petit effet d'allongement, on peut le voir sur le forum test sur la page d'accueil. Mais là ça ne le fait pas, je ne comprend pas pourquoi. Pourtant j'ai mis le même code CSS que dans mon forum, c'est les ".menulienga" et ".menuliendr". Quelqu'un aurait-il la solution ? Merci pour votre aide !
| | |
| | | Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| Alors bonjour \o/ C'est au niveau du "padding" Les valeurs pour le .menulienga et le .menuliendr sont différentes. Pour le .menulienga tu as: - Code:
-
padding: 0px 3px 0px 5px; Et pour le .menuliendr tu as: - Code:
-
padding: 0px 5px 0px 3px; Je crois que c'est là où réside le problème. Essaie de mettre les mêmes valeurs aux deux, si le problème persiste c'est ailleurs donc x) | | |
| | | Anthocyane
{ Membre }
Messages : 17
| Non ce n'est pas ça, en fait la différence de padding ".menulienga" et ".menuliendr" c'est juste selon l'emplacement du lien, s'il est à droite ou à gauche. En fait ce qui ne fonctionne pas, c'est dans le ".menulienga:hover" le "border-left: 7px solid #E8D5A7;" c'est le 7px qui doit "allonger" un peu le lien, sauf que là c'est comme si le ".menulienga:hover" ne s'appliquait pas... (de même pour le ".menuliendr:hover")
| | |
| | | Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| ....han jviens de comprendre mdr *encore endormie* Mais pourtant moi l'effet marche parfaitement oo Tu utilises quel navigateur? Enfin il marche sur la PA, pas dans le message x_x | | |
| | | Anthocyane
{ Membre }
Messages : 17
| Encore endormie à 12 h ! Oh là là ! Moi c'est plutôt bientôt couchée ! (bon p'têt pas à 17h quand même...)
J'utilise Firefox, et moi aussi il fonctionne sur la page d'accueil, mais pas dans le message, ni sur la page html d'ailleurs... Et c'est ça que je ne comprends pas...
| | |
| | | Imari
{ Membre hyper-actif }
Messages : 1538
| Bonjour ^^
Le problème est-il résolu ? | | |
| | | Anthocyane
{ Membre }
Messages : 17
| Non malheureusement... Je suis toujours bloquée au même point, et j'ai même l'impression que cela empire ! Suis-je la seule à voir que les caractères du type "é ; à ; è" du texte ne s'affichent pas bien ? À la place je vois : "Aventure dÃbute avec une petite introduction expliquant briÃ"
| | |
| | | Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| C'est que souvent les caractères spéciaux é è ê etc etc ne sont pas pris en comptes dans le html, il faut donc les remplacer par les bons codes. Il y a une liste des codes ici: http://alexandre.alapetite.fr/doc-alex/alx_special.html C'est la colonne "code texte" Par exemple: - Code:
-
é Résultat: é - Code:
-
ê Résultat: ê - Code:
-
è Résultat: è Sinon, pour ton problème, essaie de changer les valeurs des paddings dans ton code pour voir si une valeur plus grande ne change rien ou au contraire donne l'effet voulu~ | | |
| | | Anthocyane
{ Membre }
Messages : 17
|
Merci pour la page de codes ! Je vais changer tout ça... Mais ce qui m'étonne c'est qu'avant ça fonctionnait ! Ce n'est qu'un certain temps après que ça ne s'affichait plus correctement... Décidément, je n'y comprendrais rien !
Et sinon, pour les paddings, ça ne fonctionne pas, je crois que je vais devoir me résigner à ne pas avoir l'effet voulu... Tant pis.
| | |
| | | Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| o__o la balise code a déconné è_é Bref u_u De rien~ Sinon je ne sais pas si ça peut approcher ton effet voulu, mais tu peux ajouter un letter-spacing à tes mots dans les codes hover des liens, je ne sais pas si tu comprends~ Ça va espacer les lettres et par le fait même "allonger" les liens s'il n'y a plus d'espace. Genre dans "menuliendr:hover" et "menulienga:hover" tu peux mettre: - Code:
-
letter-spacing: 1px; En changeant le 1 par quelque chose d'autre si ça ne te satisfais pas x) Mais encore là je ne sais pas si ça va vouloir marcher... | | |
| | | Anthocyane
{ Membre }
Messages : 17
| Encore une fois ça ne fonctionne pas... Bon tant pis alors...
Merci pour ton aide Ikø' !
| | |
| | | Imari
{ Membre hyper-actif }
Messages : 1538
| Bonjour ^^
Le problème est-il résolu ? | | |
| | | Anthocyane
{ Membre }
Messages : 17
| Pas vraiment, mais vous pouvez clore le sujet.
| | |
| | | Contenu sponsorisé
| | | | | Problème CSS et page html | |
|
Sujets similaires | |
|
| Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|