| Problème de ressemblances (?) | |
|
Jujube
{ Membre }
Messages : 5
| Bonjour, moi et mes amies fessont un forum et nous avons quelques difficultés avec le design . Je suis présentement en train de faire les postes vacants et j'ai un problème. J'ai possitionner tous les éléments à mon goût et sur mon ordinateur c'est super beau, mais sur les autres ordinateur il y a des éléments qui ne sont pas à la bonnes place et qui sont désaligné, qui embarquent un par dessus l'autre. Dont ma question : Comme faire pour que ca affiche pareil (ou au moins semblable) sur tous les ordinateurs. Merci de nous aider | | |
|
| |
Luna Arcana
{ Membre }
Messages : 194
| Un petit aperçu du problème + les codes utilisés please =) | | |
|
| |
Jujube
{ Membre }
Messages : 5
| tu peux aller voir sur notre forum (qui est loin d'être achevé soit dit en passant): http://backinroswell.forum-actif.eu/lalalalaalla-f5/essaie-pv-t2.htm
Pour positionner les éléments dans ma page j'ai utiliser la position relative, car j'ai essayer le possitionnement absolu et ca ne marchait pas. Mais bon, j'ignore si c'est la bonne chose à faire parce que je suis vraiment débutant en css. | | |
|
| |
Luna Arcana
{ Membre }
Messages : 194
| Okay mais est ce que on peut avoir les codes que tu as utilisé ? =p Par ce que sinon on peut rien faire ^^ Et si possible un aperçu de ce que tu aimerai que ça donne. Parce que moi, je vois "Nom du personnage" double et superposé ainsi que "qualité et défaut." | | |
|
| |
Kaiji
Blanche-Neige
Messages : 5578
| Bonjour Jujube ^^
J'ai vu que tu utilisais Firefox. Peut-être que les autres membres de ton staff ont Explorer, et que tu as utilisé une majorité de codes que leur navigateur ne prend pas en compte, ce qui donnerait un résultat chaotique...
Si c'est le cas il faudra que tu mettes ton css + ton code de message dans ce topic pour trouver les codes adaptés à IE (sache par contre que tous les codes n'ont pas leur pareille pour IE - un exemple simple et courant, les bords arrondis) | | |
|
| |
Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| Bonjour~
Le problème est-il toujours d’actualité? | | |
|
| |
Jujube
{ Membre }
Messages : 5
| oui c'est toujours d'actualité! Je tiens à préciser que mon utilisation du css est propablement loin d'être parfait comme je suis débutante et que j'ai tout appris par moi même en regardant sur internet. J'ai insérer mon css dans la partie ''feuillet de css''. voici ce que j'ai écrit dans mon message (mon model de pv autrement dit): - Spoiler:
- Code:
-
<p class="prislibrereserve">Pris/Réservé/<span class=vert>Libre</span></p> <p class="nom">Nom du personnage</p> <p class="ombre">Nom du personnage</p> <p class="feat">feat le nom de l'avatar</p> <p class="image"><image src="http://www.weplug.com/images_1/b6323a2f601cd55d7a16c7b51bac0c9d20100119032832.png" <p class="unique">unique</p> <p class="monde">comme tout le monde quoi</p> <span class="defaut"> <table> <tr> <td>*une qualité</td> <td>*une qualité</td> <td>*une qualité</td> <td>*une qualité</td> </tr> <tr> <td>*un défaut</td> <td>*un défaut</td> <td>*un défaut</td> <td>*un défaut</td> </tr> </table> </span> <p class="histoire"> histoire </p> <p class="debut">début . milieu . fin (?) </p> <p class="carre1"> blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla <p> <p class="carre2"> age occupation loisir loisir loisir </p> <p class="liens">Liens</p> <p class="icone1"><img src="http://i63.servimg.com/u/f63/11/83/42/80/sans_202.png" </p> <p class="icone2"><img src="http://i40.tinypic.com/346pdgl.png" </p> <p class="icone3"><img src="http://i42.tinypic.com/fog2tt.png" </p> <p class="icone4"><img src="http://i42.tinypic.com/jt3uvb.jpg" </p> <p class=couleur>couleur: couleur
odeur: odeur</p> <select class="roulant1"> <option value="perso1">Rachel Berry</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> </select> <select class="roulant2"> <option value="perso2">Noah Puckerman</option> <option value="perso2">blablablablablablabla</option> <option value="perso2">blablablablablablabla</option> <option value="perso2">blablablablablablabla</option> <option value="perso2">blablablablablablabla</option> <option value="perso2">blablablablablablabla</option> <option value="perso2">blablablablablablabla</option> <option value="perso2">blablablablablablabla</option> <option value="perso2">blablablablablablabla</option> <option value="perso2">blablablablablablabla</option> </select> <select class="roulant3"> <option value="perso1">Quinn Fabray</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> </select> <select class="roulant4"> <option value="perso1">Blair Waldorf</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> <option value="perso1">blablablablablablabla</option> </select> <p class="feat1"> feat le.prénom le.nom </p>
<p class="feat2"> feat le.prénom le.nom </p>
<p class="feat3"> feat le.prénom le.nom </p>
<p class="feat4"> feat le.prénom le.nom </p>
voici le code css dans le ''feuillet CSS'': - Spoiler:
- Code:
-
.prislibrereserve { border-top: 2px solid black; borer-left: none; border-right: none; border-bottom: 1px solid black; width: 173px; height: 23px; float:right; text-align: justify; text-valign: center; position:relative; right: 40px; top: 5px; font-size: 165%; font-family:Georgia, serif; padding-top: 4px; paddnig-left: 8px; }
.nom { font-style: italic; font-weiht: bold; font-size: 41px; font-family: Garamond, serif; position:relative; left: 73px; top: 47px; z-index: 1; } .ombre { font-style: italic; font-weiht: bold; font-size: 41px; font-family: Garamond, serif; position:relative; left: 81px; bottom: 60px; z-index: 2; } .feat { font-size: 11px; float:left; position:relative; bottom: 1000px; left:500px; } .image { border: 4px double black; float:right; position:relative; bottom: 105px; right: 15px; z-index: 1; } .unique { position:relative; bottom: 60px; left: 134px; font-family: "Bookman Old Style", serif; font-size: 31px; letter-spacing: 9px; } .monde { font-weiht: bold; font-family: Garamond, serif; font-size: 18px; position:relative; float:left; bottom: 112px; left: 60px; letter-spacing: 5px } .defaut { float:left; position:relative; bottom: 350px; left: 68px; }
.histoire { float:left; position:relative; right: 166px; bottom: 260px; font-family: "Bookman Old Style", serif; font-size: 30px; letter-spacing: 9px; } .debut { font-weiht: bold; font-family: Garamond, serif; font-size: 18px; letter-spacing: 5px; float:left; position:relative; bottom: 300px; right: 210px; } .carre1 { position:relative; bottom: 290px; left: 40px; font-style: italic; font-size: 108%; font-family: Georgia, serif; width: 300px; }
.carre2 { border:4px double; background-color:white; width: 105px; height: 105px; text-align: center; position:relative; bottom: 845px; left: 530px; z-index: 2; } .liens { position:relative; left: 530px; bottom:870px; } .icone1 { position:relative; left: 415px; bottom: 880px; width: 75px; height: 75px; } .icone2 { position:relative; left: 415px; bottom: 875px; width: 75px; height: 75px; } .icone3 { position:relative; left: 415px; bottom: 880px; width: 75px; height: 75px; } .icone4 { position:relative; left: 415px; bottom: 880px; width: 75px; height: 75px; } .couleur { position:relative; left: 160px; bottom: 980px; } .roulant1 { position:relative; left: 524px; bottom: 1405px; } .roulant2 { position:relative; left: 524px; bottom: 1315px; } .roulant3 { position:relative; left: 524px; bottom: 1215px; } .roulant4 { position:relative; left: 524px; bottom: 1125px; } .vert { color:#006633; } .feat1 { font-size: 10px; position:relative; bottom:1540px; left: 530px; }
.feat2 { font-size: 10px; position:relative; bottom:1522px; left: 530px; }
.feat3 { font-size: 10px; position:relative; bottom:1492px; left: 530px; }
.feat4 { font-size: 10px; position:relative; bottom:1470px; left: 530px; }
ici voici mon model de pv comme je le vois dans mon écran (j'ai fait un print écran,j'ai collé 3 images donc, c'est flou mais c'est environ ça). C'est comme ca que j'aimerais que tout le monde le voit ( ce n'est pas la version fini parce que j'ai décidé de régler ce problème avant de terminer.) - Spoiler:
Merci infiniment de m'aider j,en sui super reconnaissante | | |
|
| |
Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| Je voudrais vérifier quelque chose~ C'est à dire, si c'est la faute du navigateur.
Pour ça, j'aurais besoin du lien de ton forum (envoie le par mp si tu ne veux pas l'afficher publiquement), et je vais pouvoir vérifier si sur mon PC je vois la même chose sur Firefox, sur Internet Explorer, sur Google Chrome, sur Safari et sur Opera =D | | |
|
| |
Kaiji
Blanche-Neige
Messages : 5578
| Elle a donné le lien dans son 2ème message : http://backinroswell.forum-actif.eu/lalalalaalla-f5/essaie-pv-t2.htm
Et c'est effectivement un soucis de navigateur, je n'ai pas le même résultat sous Firefox et sous Explorer =) | | |
|
| |
Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| L'avait pas vu sorry x_x Effectivement sous IE c'est spécial oo J'ai remarqué que tu utilisais beaucoup le code - Code:
-
<p class="class">blabla~</p> C'est peut-être là la source du problème. Moi je dis, si on change les p par des span et qu'on met des - Code:
-
<br/> Pour faire le retour à la ligne, ça va déjà être mieux \o/ Je sais pas si tu comprends ce que je veux dire Jujube oo Sinon, je vais changer les trucs pour toi mais plus tard, jdois me préparer, je pars dans 3h pour mon examen de conduite --" xDD | | |
|
| |
VPeybernes
{ Membre actif }
Messages : 563
| Moi j'ai remarqué ça aussi. - Code:
-
<p class="icone4"><img src="http://i42.tinypic.com/jt3uvb.jpg" </p> Mais surtout, la clef du problème : - Code:
-
<p class="carre1"> blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla blablablablablablablablablablablablablablablablabla <p> Et ça a choqué personne ? Attention à bien fermer les balise. | | |
|
| |
Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| J'avais pas super le temps donc non je n'avais pas vu ça, mais maintenant si~ Donc c'est vrai que si les balises sont mal fermées, c'est peut-être ce qui génère le bug~~~ | | |
|
| |
Kaiji
Blanche-Neige
Messages : 5578
| Bonjour,
Votre problème est-il résolu ? Si oui, merci de cocher dans "icône du sujet" l'icône "résolu" en éditant votre 1er post.
| | |
|
| |
Kaiji
Blanche-Neige
Messages : 5578
| Bonjour,
Aucune relance de la part du créateur du sujet ! Je considère donc ce problème comme étant résolu et je le déplace pour céder la place aux problèmes en cours.
Si vous avez d'autres questions, merci d'ouvrir un nouveau topic en respectant les règles de l'entraide.
| | |
|
| |
Contenu sponsorisé
| |
| |
| Problème de ressemblances (?) | |
|