Pb mauvais affichage d'un bouton en localhost
Fermé
azertyamin
Messages postés
6
Date d'inscription
mardi 2 février 2010
Statut
Membre
Dernière intervention
23 avril 2010
-
23 avril 2010 à 13:07
azertyamin Messages postés 6 Date d'inscription mardi 2 février 2010 Statut Membre Dernière intervention 23 avril 2010 - 23 avril 2010 à 18:43
azertyamin Messages postés 6 Date d'inscription mardi 2 février 2010 Statut Membre Dernière intervention 23 avril 2010 - 23 avril 2010 à 18:43
A voir également:
- Pb mauvais affichage d'un bouton en localhost
- Bouton on off ✓ - Forum Loisirs / Divertissements
- Localhost/phpmyadmin ✓ - Forum PHP
- Bouton shift pc ✓ - Forum Windows
- Taille bouton css - Forum HTML
- Localhost n'autorise pas la connexion ✓ - Forum Webmastering
3 réponses
desperadosse
Messages postés
199
Date d'inscription
mardi 15 avril 2008
Statut
Membre
Dernière intervention
26 avril 2011
7
23 avril 2010 à 13:12
23 avril 2010 à 13:12
Ta essayer un no-repeat je suppose ?
j'aimerai voir ton CSS si cela ne te pose pas de problème.
merci d'avance
j'aimerai voir ton CSS si cela ne te pose pas de problème.
merci d'avance
azertyamin
Messages postés
6
Date d'inscription
mardi 2 février 2010
Statut
Membre
Dernière intervention
23 avril 2010
23 avril 2010 à 18:05
23 avril 2010 à 18:05
Si qlq a une sol il sera le bien venu
desperadosse
Messages postés
199
Date d'inscription
mardi 15 avril 2008
Statut
Membre
Dernière intervention
26 avril 2011
7
23 avril 2010 à 18:26
23 avril 2010 à 18:26
Est ce que tu as ta source HTML stp ?
Que je l'analyse.
Si je récapitule, tes boutons s'affichent correctement en ligne mais pas en local ?
Que je l'analyse.
Si je récapitule, tes boutons s'affichent correctement en ligne mais pas en local ?
azertyamin
Messages postés
6
Date d'inscription
mardi 2 février 2010
Statut
Membre
Dernière intervention
23 avril 2010
23 avril 2010 à 18:43
23 avril 2010 à 18:43
En fait la partie HTML est écrie en haut de page ici
Mais j'ai trouver un nouveau code qui marche mieux en local
Si vous voulez dire en ligne par une un teste de la page sans localhost ;) oui évidement sa marche en ligne et pas en local !!!
Donc le nouveau code qui marche est le suivant :
<html>
<head>
<link rel="stylesheet" href="bouton.css" type="text/css" media="screen" />
</head>
<body>
<span id="dmcbouton"><a href="#"><b>mot bouton</b></a></span>
</body>
</html>
et sa partie css est :
#dmcbouton{
background-image:url(bt_c_g.gif);
background-repeat:no-repeat;
}
#dmcbouton a{
padding-right:21px; /*largeur de l'image bt_c_g.gif*/
margin-left:21px; /*largeur de l'image bt_c_g.gif*/
background-image:url(bt_c_d.gif);
background-repeat:no-repeat;
background-position:100% 0;
text-decoration:none;
}
#dmcbouton a,#dmcbouton{
display:-moz-inline-box;
display:inline-block;
height:37px; /*hauteur de l'image*/
white-space:nowrap;
}
#dmcbouton a b{
vertical-align:top;
font-size:12px;
display:block;
cursor:pointer;
_display:inline-block;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
line-height:37px; /*hauteur de l'image*/
vertical-align:middle;
color:#fff;
}
------------------
J'aimerai comprendre pk cella marche et l'autre pas !!!!!
et merci encore une fois ^_^
Mais j'ai trouver un nouveau code qui marche mieux en local
Si vous voulez dire en ligne par une un teste de la page sans localhost ;) oui évidement sa marche en ligne et pas en local !!!
Donc le nouveau code qui marche est le suivant :
<html>
<head>
<link rel="stylesheet" href="bouton.css" type="text/css" media="screen" />
</head>
<body>
<span id="dmcbouton"><a href="#"><b>mot bouton</b></a></span>
</body>
</html>
et sa partie css est :
#dmcbouton{
background-image:url(bt_c_g.gif);
background-repeat:no-repeat;
}
#dmcbouton a{
padding-right:21px; /*largeur de l'image bt_c_g.gif*/
margin-left:21px; /*largeur de l'image bt_c_g.gif*/
background-image:url(bt_c_d.gif);
background-repeat:no-repeat;
background-position:100% 0;
text-decoration:none;
}
#dmcbouton a,#dmcbouton{
display:-moz-inline-box;
display:inline-block;
height:37px; /*hauteur de l'image*/
white-space:nowrap;
}
#dmcbouton a b{
vertical-align:top;
font-size:12px;
display:block;
cursor:pointer;
_display:inline-block;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
line-height:37px; /*hauteur de l'image*/
vertical-align:middle;
color:#fff;
}
------------------
J'aimerai comprendre pk cella marche et l'autre pas !!!!!
et merci encore une fois ^_^
23 avril 2010 à 13:27
Alors voila la partie CSS :
.bouton {
background: url('bouton gauche.png'); /* Bord gauche et contenu du bouton */
float: left; /* Afin que le DIV prenne la largeur de son contenu, et non la largeur de la page, pour des raisons didactiques */
margin: 7px; /* Espacer les boutons entre eux, rien à voir avec la technique des portes coulissantes */
}
.bouton div {
background: url('bouton droit.png') 100% 0 no-repeat; /* Bord droit du bouton, aligné à droite ! */
height: 30px; /* Hauteur des images bouton-gauche.png et bouton-droite.png */
line-height: 30px; /* Centrer le texte verticalement sur le bouton */
padding: 0 10px; /* S'assurer que le texte ne soit pas collé aux bordures du bouton */
color: white; /* Le bouton est bleu foncé, le texte doit être clair */
}
en fait j'ai pas utiliser no-repeat car j'y connait pas mais je fait mes recherche ;)
Bonne continuation .
23 avril 2010 à 13:32
23 avril 2010 à 18:04
voici le code changer :
background: url('bouton-gauche.png') no-repeat;;