Sipatshi: Zeilenhöhe zwischen Textfeld und Submit. line-height geht nicht.

Hallo zusammen,

wie bekomme ich das hin das die Zeilenhöhe zwischen Texfeld und Submit sich um ein paar px verlängert? mit line-height scheint es wohl nicht zu funktionieren.

Gruß Sipatshi

.input_m_frame {
 height:60px;
}

.input_frame {
 font-family:Arial;
 color:#000000;
 font-size:12px;
 height:12px;
 width:92px;
}
.submit_frame {
 font-family:Arial;
 color:#000000;
 font-size:12px;
 height:28px;
 width:178px;
}

------------------------------------------------------------------

<form class="input_m_frame" >
      <b>PLZ Bereich&nbsp;</b>
      <input class="input_frame" type="text" name="textfield" id="texfield"/>
      <br /><!-- Zeilenhöhe 6px verlängern  -->
      <input class="submit_frame" type="submit" name="button"
       id="button" value="Aufträge suchen" />
</form>

  1. Hallo Sipatshi,

    Hallo zusammen,

    wie bekomme ich das hin das die Zeilenhöhe zwischen Texfeld und Submit sich um ein paar px verlängert? mit line-height scheint es wohl nicht zu funktionieren.

    <form class="input_m_frame" >
          <b>PLZ Bereich&nbsp;</b>
          <input class="input_frame" type="text" name="textfield" id="texfield"/>
          <br /><!-- Zeilenhöhe 6px verlängern  -->
          <input class="submit_frame" type="submit" name="button"
           id="button" value="Aufträge suchen" />
    </form>

    Doch, am richtigen Element angewendet geht das schon mit Line-Height:
    Nimm zwei BR-Elemente hintereinander!
    Dem ersten gibst du line-height:0;,
    dem zweiten line-height:6px;

    Gruß Gernot

    1. Hallo Gernot :-)

      danke für den Hinweis :-) Firefox kommt damit klar, allerdings der I-Explorer nicht. Es sieht so aus als würde die line-height 30px betragen. Gibt es eine andere Lösung? Für Firefox und I-Explorer?

      1. Hallo Sipatshi,

        danke für den Hinweis :-) Firefox kommt damit klar, allerdings der I-Explorer nicht.

        Bei mir kommen unter Windows XP alle neuesten Browserversionen (inkl. IE 7, Opera 9, Safari 3, Firefox 3) damit klar, darüber hinaus auch der IE 6, alle sogar unabhängig vom CSS-Kompatibilitätsmodus.

        Einzig Firefox 2 scheint mit den zwei BR-Elementen Probleme zu haben und macht einen geringeren Abstand als alle anderen Browser.

        Gruß Gernot

  2. wie bekomme ich das hin das die Zeilenhöhe zwischen Texfeld und Submit sich um ein paar px verlängert? mit line-height scheint es wohl nicht zu funktionieren.

    Wieso Zeilenhöhe? Warum benutzt du nicht margin?

    Struppi.