Hauteur CSS des boutons dans safari

Steph-24 · 16 Décembre 2007

Bonjour à tous,

Je suis en train de développer une application web. Je teste mon application avec Safari et Firefox.
Et j'ai un petit problème avec la hauteur des boutons que je définie en CSS.

J'ai beau changé la hauteur (propriété height) entre 15px et 30px, ça ne change rien dans Safari. Pareil pour la taille de la police. :mouais:

Je ne comprend pas vraiment d'où ça peut venir mis à part une restriction de la part de Safari pour une question d'ergonomie.

Avez-vous des précisions ?

Merci et bonnes fêtes à tous

Anonyme · 16 Décembre 2007

si c'est Safari2 c'est normal : il utilise les widgets cocoa, safari3 utilise ses propres widgets "stylables"...

Niconemo · 16 Décembre 2007

Sans voir ta CSS et un bout de XHTML, impossible de t'aider.

Mais je penche pour deux problèmes possibles :

1 - une petite erreur typo dans la CSS ou dans le XHTML. Safari est plus sensible à ce niveau là.

2 - autre solution aussi : tu es certain que ce n'est pas un problème de cache dans safari ?

une petite URL ou des extraits de code suffisant nous aideraient grandement à te dépanner…

Steph-24 · 16 Décembre 2007

Niconemo a dit:
Sans voir ta CSS et un bout de XHTML, impossible de t'aider.

Mais je penche pour deux problèmes possibles :

1 - une petite erreur typo dans la CSS ou dans le XHTML. Safari est plus sensible à ce niveau là.

2 - autre solution aussi : tu es certain que ce n'est pas un problème de cache dans safari ?

une petite URL ou des extraits de code suffisant nous aideraient grandement à te dépanner

Voilà le code HTML du bouton :

<body>
<input id="btn_01" type="button" value="Valider"/>
</body>

ET le css correspondant

#btn_01
{
height : 22px;
font-size : 14px;
}

Et quand je récupère la hauteur du bouton avec Javascript, je n'ai pas les même dimensions qui s'affichent :mouais:

Anonyme · 16 Décembre 2007

Ton code html est vraiment minimum…

Comme ça j'agrandis ton bouton :

Bloc de code:

     <style type="text/css" media="screen">
        #btn_01 {
            font-size: 2em;
        }
    </style>

Je ne sais pas si il doit rentrer dans un formulaire mais normalement ça serait plutôt un code dans ce genre là qu'il faudrait utiliser :

Bloc de code:

    <form action="https://www.paypal.com/cgi-bin/webscr" method="post">
        <p>
            <input id="btn_01" type="submit" value="Valider"/>
        </p>
    </form>

Utilisation des formulaires

Bien valider ses formulaires avec Javascript

Et surtout : Comment ne pas styler les éléments de formulaire ?

Steph-24 · 16 Décembre 2007

gloup gloup a dit:
Ton code html est vraiment minimum

Comme ça j'agrandis ton bouton :

Bloc de code:

<style type="text/css" media="screen"> #btn_01 { font-size: 2em; } </style>

Je ne sais pas si il doit rentrer dans un formulaire mais normalement ça serait plutôt un code dans ce genre là qu'il faudrait utiliser :

Bloc de code:

<form action="https://www.paypal.com/cgi-bin/webscr" method="post"> <p> <input id="btn_01" type="submit" value="Valider"/> </p> </form>

Utilisation des formulaires

Bien valider ses formulaires avec Javascript

Et surtout : Comment ne pas styler les éléments de formulaire ?

Oui j'ai seulement mis un exemple minimum. Ce que je ne comprend pas c'est quoi pour un div par exemple ou pour un label, on peut dire qu'il doit faire 200px par 50px et que pour un bouton, si je lui donne les mêmes propriétés, ça ne fonctionne pas.

Je ne comprend pas.

Je n'arrive en plus pas à avoir les même dimensions de boutons sur Firefox et Safari

Warflo · 16 Décembre 2007

Tu utilises Safari 2 ou 3 ?
Sur Safari 2 cela me semble normale. Il ne gère pas la modification des widget.
Mais c'est vrai que Safari 3 gère mieux ces transformation (<select> colorés, etc.)

Steph-24 · 16 Décembre 2007

Warflo a dit:
Tu utilises Safari 2 ou 3 ?
Sur Safari 2 cela me semble normale. Il ne gère pas la modification des widget.
Mais c'est vrai que Safari 3 gère mieux ces transformation (<select> colorés, etc.)

Je suis sur Leopard et Safari 3. Mais rien à faire, il ne me prend pas mes dimensions.
Il met les siennes. En fait il a des valeurs "clés" et si on tape une valeur entre les valeurs "clés", il prend une de ses valeurs "clés" la plus proche.

Hauteur CSS des boutons dans safari

Steph-24

Membre expert

Anonyme

Invité

Niconemo

Modo (toujours vivant !)

Steph-24

Membre expert

Anonyme

Invité

Steph-24

Membre expert

Warflo

Membre expert

Steph-24

Membre expert

Sujets similaires