css différence entre firefox/Mac & firefox/Windows

Je travaille sur un modèle avec un designer et nous voyons des choses différentes. Dans mon navigateur sur Mac, le champ de saisie est à côté des étiquettes mais pour le concepteur dans son navigateur, les champs de saisie sont sous les étiquettes.css différence entre firefox/Mac & firefox/Windows

J'utilise le css reset de eric meyer pour que tout soit correct. Voici une capture d'écran pour illustrer ce que je veux dire (à gauche est ce qu'il doit être et à droite ce qu'il ne devrait pas être)

alt text

Est-ce que quelqu'un sait comment cela pourrait être fixé?

Source

2010-10-26 Christophe

Pouvez-vous nous montrer le code que vous utilisez? – ajcw

deviner: 'text ' est l'emballage à cause du rembourrage du conteneur – drudge

Si les tailles de champs sont données en em s, modifiez-les en px. Les tailles de police ne sont pas parfaites en pixels (différents navigateurs l'arrondissent différemment, la largeur exacte peut dépendre de la police, surtout si cet espace entre les champs est un espace). Laissez de la place dans le conteneur (faites en sorte que l'élément contenant quelques pixels soit plus large que nécessaire).

Vous pouvez également essayer:

input { 
box-sizing: border-box; 
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; 
}

Ce qui fait la taille des éléments de forme un peu plus cohérente.

Source

2010-10-26 20:50:40 Kornel

Laissant de la place est bon, mais que faut-il faire si nous voulons que les éléments intérieurs touchent les bords de la boîte contenant? Par exemple, en cas de menu principal horizontal d'un site? –

@ D3K Vous pouvez utiliser 'display: inline-block' pour les éléments (éviter les espaces dans la source!) Et' white-space: nowrap' sur le conteneur. Pour les flotteurs avec des tailles de pourcentage ou d'em, je ne connais aucun moyen de garantir une somme de pixels parfaite. – Kornel

Je sais que cette question est posée il y a longtemps, mais j'avais un problème similaire aujourd'hui et je pensais partager la solution qui a fonctionné pour moi.

Mettez un font-size et width dans le champ de saisie, cela pourrait aider car il semble que les valeurs par défaut pour font-size sont (ou peuvent être) différentes dans Windows et Mac. De cette façon, vous pouvez continuer à utiliser em s, que je préfère personnellement utiliser.

Source

2014-02-24 19:46:25

entrée est toujours la bienvenue :) merci. Je ne les aime pas vraiment parce que le parent peut facilement l'influencer. Cependant, il est nouveau frère rem semble résoudre ce problème. – Christophe

Vous pouvez essayer quelque chose comme $ _SERVER ['HTTP_USER_AGENT'] si vous utilisez php ou vérifiez comment obtenir l'agent utilisateur dans le langage de programmation côté serveur choisi. En fonction de l'agent utilisateur, vous pouvez coller la condition dans la section head du document html pour imprimer le CSS. Assurez-vous qu'il est le dernier dans l'ordre afin que vous puissiez remplacer votre css écrit précédemment. Ceci est juste une option. Ceci est utile si vous avez un design complexe.

Source

2015-10-07 19:52:10

css différence entre firefox/Mac & firefox/Windows

Répondre

Questions connexes