Partage
  • Partager sur Facebook
  • Partager sur Twitter

Champs + boutons + css

Décalage de 1pixel sous IE

Sujet résolu
ComandoCool
    28 avril 2006 à 22:17:00

    Bonsoir,

    J'ai différents champs et boutons alignés, je voudrais qu'il soient de même hauteur.
    Avec le code ci-dessous, sous IE j'ai les boutons qui font 1 px de trop de hauteur, parfait pour Firefox.
    Si j'ajoute un height à 18px sur tous les input je me retrouve avec 1 px de travers sous Firefox cette fois-ci, alors que IE pas de problème.
    Sans plus tarder je vous livre le code minimum du problème :
    <style type="text/css">
    input {
            font-family: Verdana;
            font-size: 8pt;
            color: #333333;
            background-color: #FBFBFB;
            border: 1px solid gray;
            font-family: Verdana;
            font-size: 8pt;
            width: 67px;
    }
    .msg {
            width: 201px;
    }
    </style>
    <form>
            <input type="text">
            <input type="text" class="msg">
            <input type="submit" value="Envoyer">
            <input type="button" value="Envoyer">
    </form>

    Si vous aviez une solution pour structurer tout ça au pixel près, merci d'avance !
    • Partager sur Facebook
    • Partager sur Twitter
    atly
      29 avril 2006 à 9:13:42

      Salut,
      Ca doit venir de la bordure. Au pire, utilise un détournement CSS.
      • Partager sur Facebook
      • Partager sur Twitter
      cyril94440
        29 avril 2006 à 9:20:34

        Utilise les !important :

        .TEXT{
        font-size:18px !important;
        font-size:19px;
        }

        Le text aura alors une hauteur de 18 px sour FF et de 19px sous IE , il y a un tuto sur ca va voir il explique mieu que moi.
        • Partager sur Facebook
        • Partager sur Twitter
        ComandoCool
          29 avril 2006 à 11:45:02

          Excellente méthode en effet et pratique.
          J'ai testé sauf que j'ai IE7, donc il comprends tout comme firefox le !important sauf que les boutons sont toujours 1px plus haut. Merci quand même ça me servira.

          Edit: c'est bon ! j'ai utilisé un autre hack pour IE et celui-ci fonctionne, voici le code que j'ai ajouté :
          <!--[if IE]>
          <style type="text/css">
          input {
                  height: 18px;
          }
          </style>
          <![endif]-->
          • Partager sur Facebook
          • Partager sur Twitter

          Champs + boutons + css

          × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
          × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
          • Editeur ●
          • Markdown