Discussion :

[flo21470]

Bonjour à tous, je suis un grand débutant en CSS, et je dois pour un projet avec les cours modifier une feuille de style afin que l'affichage des boutons soit correct. voila ce que j'ai sur iphone :



voila ce que j'ai sur les autres navigateurs :

http://nsa27.casimages.com/img/2011/...2426891589.png

maintenant voici mon code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.bouton3 {width:100px; height:100px; border:1; background: transparent url(Icones/doc.png)no-repeat;background-position:50% 50%;}

quelqu'un pourrait m'explique ce que je dois modifier pour modifier uniquement le style sur Safari Mobile? Il faudrait soit que j'ai le même style que sur les autres navigateurs soit que je supprime les image de fond du bouton.
Merci d'avance

[Emyleen]

Bonsoir,

Essaye de mettre tes boutons en display: block peut etre.

Sinon il te faudrait peut être faire un css spécifique aux smartphones en rajoutant

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

@media (max-device-width: 480px) {}

devant tes styles ou alors essaye de rajouter cette balise meta dans ton html :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<meta name="viewport" content="width=device-width">

Mais j'avoue que là je vois pas trop :s

[flo21470]

Maitenant je dois donc avoir

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
input.bouton1 {width: 14%; height: 5%; min-height:30px; max-height:50px; align:"center"; font-size:80%;}
.bouton2 {width: 50px; height: 50px;}
.bouton3 {width:100px; height:100px; border:1; background: transparent url(Icones/doc.png)no-repeat;background-position:50% 50%; display: block;}
 
 @media (max-device-width: 980px) {
 input.bouton1 {width: 14%; height: 5%; min-height:30px; max-height:50px; align:"center"; font-size:80%;}
.bouton2 {width: 50px; height: 50px;}
.bouton3 {width:100px; height:100px; border:1;  display: block;}
}

c'est bien sa??

[flo21470]

bonjour, n'ayant toujours pas trouvé de solution fonctionnelle à ce jour, je fais un gros up pour vous redemander de l'aide...
Bonne journée et bonne année à tous

[Sergejack]

essaie un padding pour voir (genre 'height: 0px; padding: 50px 0px;").

[flo21470]

Sa ne marche toujours pas... Safari mobile et Safari sont censé être le même navigateur d'après la page apple dédiée au navigateur, alors pourquoi ne réagissent-ils pas de la même façon au chargement de la même page???

[NoSmoking]

Bonsoir,
as tu essayé avec des button plutôt que des input, qui sait?

[flo21470]

Merci à tous d'avoir essayé de m'aider. Après multiples exploration du code PHP du site j'ai enfin trouvé. Une accumulation d'erreurs par les étudiants précédents qui avait travaillés sur le projet faisait que j'ai modifié dans tous les sens un bouton fantôme...
Bonne continuation à tous