Lomakkeen elementtien asemointi

- label -

"label" -tagilla saa sujuvasti tekstin ja lomakekentän samalle riville. Millä keinolla kentät saisi alkamaan vertikaalisesti samasta kohdasta, kun teksti on asemoitu vasempaan reunaan. Taulukolla tai divillä olen tuon tasauksen tehnyt aikaisemmin (ilman label-määritystä), mutta onko muuta keinoa? Laitoin inputtiin margin-left, sekä px- että em-määrityksellä. Ei oikein toiminut.

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


Etunimi:


Sukunimi:




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

7

470

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • juhakorkeapudas

      Käytä labelia mielummin näin:

      Etunimi:

      • al....

        just eli sidotaan elementit yhteen, sehän tuon idea ilmeisesti onkin ja siitä ajattelinkin, että tuon avulla, css:llä voisi saada nuo inputit jollain keinoin tasattua (tyylin sarkaimet...) , tai muukin konsti käy, ei kuitenkaan taulukko tai se, että elementit laitetaan omiin diveihin.

        Mikähän siinä on, ettei html:ään ole alunperin kyhätty sarkainsysteemiä?


    • Miksi et käyttäisi taulukkoa? Kenttien selitetekstit ja itse kentät muodostavat loogisesti taulukon, joten miksi siis niitä ei merkattaisi taulukoksi?

      Label-elementeillä ei ole muotoilun kanssa tekemistä. Ne eivät vaikuta ulkoasuun vaan toiminnallisuuteen.

      Kyllähän asemoinnin voi tehdä CSS:lläkin, mutta se on hankalampaa ja kömpelömpää. Voit käyttää positiointia tai kelluvia elementtejä (float: left), ks. jälkimmäisestä esimerkkiä
      http://www.cs.tut.fi/~jkorpela/forms/tables.html#css

      Kenttien pituudet kannattaa muuten valita niin, että ne jotenkin vastaavat tyypillisen syöttötiedon pituutta. Esimerkiksi 40 merkkiä etunimelle on suhteetonta, eikä sukunimellekään kannata niin paljoa varata. Esim. 20 ja 30 riittänevät. (Ja on hyvä, että tekstikentät ovat eripituiset, jos niiden tyypilliset sisällöt ovat erimittaiset.)

      Taiton kannalta ei kannata käyttää -merkkausta, se tekee vain muotoilun hankalammaksi (kappaleiden oletusmuotoilun takia) eikä ole loogistakaan. Käytä -elementtejä, jos jostain syystä et halua käyttää taulukkoa.

      • ap...

        .. taulukkoa juuri käytänkin ja diveilläkin homma onnistuu. Tuo label vain oli minulle uusi juttu. Tänään sattui silmään ja siitä syntyi alkuperäinen kysymys. Nyt kun siihen perehdyin, hyödyt taitavat olla aika marginaaliset.

        Sanoppa nyt sinä asiantuntujana, miksi html:n ei ole värkätty jonkinlaista sarkainsysteemiä, kuten tekstinkäsittely- ja taitto-ohjelmissa? Tokihan saman asian ajavat taulukot ja divit, mutta siitä huolimatta. Oikeastaan ensinnä ajattelin, että jokin "sarkainjuttu" saattaisi liittyä tuohon labeliin.


      • Yucca
        ap... kirjoitti:

        .. taulukkoa juuri käytänkin ja diveilläkin homma onnistuu. Tuo label vain oli minulle uusi juttu. Tänään sattui silmään ja siitä syntyi alkuperäinen kysymys. Nyt kun siihen perehdyin, hyödyt taitavat olla aika marginaaliset.

        Sanoppa nyt sinä asiantuntujana, miksi html:n ei ole värkätty jonkinlaista sarkainsysteemiä, kuten tekstinkäsittely- ja taitto-ohjelmissa? Tokihan saman asian ajavat taulukot ja divit, mutta siitä huolimatta. Oikeastaan ensinnä ajattelin, että jokin "sarkainjuttu" saattaisi liittyä tuohon labeliin.

        Kuten mainitsin, label-elementti ei vaikuta sivun asetteluun. Olit siis ymmärtänyt väärin sen merkityksen. Sen hyödyt ovat ihan muualla kuin ulkoasun säätelyssä, ja ne ovat hyvin huomattavat, ainakin monille käyttäjille (näkövammaiset, käden motoriikan ongelmista kärsivät ym.).

        HTML:ään värkättiin alun perin jonkinlainen sarkainsysteemi (pre-elementin sisällä TAB-merkki periaatteessa sarkaa), mutta se havaittiin kömpelöksi ja epäluotettavaksi.

        Modernissa tekstinkäsittelyssäkään ei käytetä sarkainsysteemejä vaan tyyliasetuksia tai taulukoita. Sarkaimet kuuluvat kirjoituskoneiden ja rivikirjoittimien maailmaan.


      • ......
        Yucca kirjoitti:

        Kuten mainitsin, label-elementti ei vaikuta sivun asetteluun. Olit siis ymmärtänyt väärin sen merkityksen. Sen hyödyt ovat ihan muualla kuin ulkoasun säätelyssä, ja ne ovat hyvin huomattavat, ainakin monille käyttäjille (näkövammaiset, käden motoriikan ongelmista kärsivät ym.).

        HTML:ään värkättiin alun perin jonkinlainen sarkainsysteemi (pre-elementin sisällä TAB-merkki periaatteessa sarkaa), mutta se havaittiin kömpelöksi ja epäluotettavaksi.

        Modernissa tekstinkäsittelyssäkään ei käytetä sarkainsysteemejä vaan tyyliasetuksia tai taulukoita. Sarkaimet kuuluvat kirjoituskoneiden ja rivikirjoittimien maailmaan.

        >> Modernissa tekstinkäsittelyssäkään ei käytetä sarkainsysteemejä vaan tyyliasetuksia tai taulukoita. Sarkaimet kuuluvat kirjoituskoneiden ja rivikirjoittimien maailmaan. >>

        Onhan se nyt pirun hankalaa tehdä taulukko tai joku erillinen tyyli (joka ei perustu sarkaimiin) siinä tapauksessa jos haluaa tasata esim. yhden yksittäisen rivin tai lyhyen kappaleen tekstit.

        Sama juttu html:ssä.


      • ...... kirjoitti:

        >> Modernissa tekstinkäsittelyssäkään ei käytetä sarkainsysteemejä vaan tyyliasetuksia tai taulukoita. Sarkaimet kuuluvat kirjoituskoneiden ja rivikirjoittimien maailmaan. >>

        Onhan se nyt pirun hankalaa tehdä taulukko tai joku erillinen tyyli (joka ei perustu sarkaimiin) siinä tapauksessa jos haluaa tasata esim. yhden yksittäisen rivin tai lyhyen kappaleen tekstit.

        Sama juttu html:ssä.

        En tiedä, mitä tarkoitat yhden rivin tai kappaleen tekstien tasaamisella, mutta ei se ole hankalampaa kuin sarkainten käyttö.

        Yleensä sarkaamisella tarkoitetaan taulukkomaista asettelua, joten sarkaimet ovat alkujaankin vain taulukoiden jäljittelyä. (Englanninkielinen nimikin tulee siitä: ”tab” on lyhentymä sanasta ”tabulate”, joka taas johtuu latinan sanasta ”tabula” ’taulu’.)

        Tässä tarkoitat ilmeisesti sarkaamisen hyvin yksinkertaista erikoistapausta: vasemman reunuksen asettamista eli sitä, että rivi tai rivit alkavat enemmän oikealta kuin jokin perusasetus. Ei sen tekeminen Wordissa ilman sarkaimia ole mitenkään vaikeaa.

        CSS:llä se on todella helppoa, esimerkiksi

        Parempi on toki määritellä luokka, jolloin samaa muotoilua voi käyttää muuallakin ja jolloin tyyliasetukset ovat paremmin hallittavissa.


    Ketjusta on poistettu 0 sääntöjenvastaista viestiä.

    Luetuimmat keskustelut

    1. Suomi on täysin sekaisin

      Jo ties monettako päivää hirveä itku ja poru jostain helvetin nilviäisistä. https://www.is.fi/taloussanomat/art-2000010
      Maailman menoa
      450
      4839
    2. Ensimmäisestä kohtaamisesta saakka

      minulla on ollut hämmentynyt olo. Miten voit tuntua siltä, että olisin tuntenut sinut aina? Sinun kanssasi on yhtä aikaa
      Ikävä
      15
      1722
    3. Aivan täysin tahallinen teko

      Ei mitään puolusteluja, eikä selittelyitä. Kuljettajalle kerrottiin asiasta siinä paikanpäällä, mutta silti hän ajoi ves
      Suomussalmi
      94
      1468
    4. Suomussalmi saatu vihdoin maailmankartalle!

      Nyt kun Suomussalmi on vihdoin viimein saatu ennennäkemättömällä tavalla maailman tietoisuuteen niin voitaisiin järjestä
      Suomussalmi
      53
      1359
    5. Olet saanut minut sekoamaan

      Tunteiden ristiaallokossa vellominen on ollut melkoinen kokemus. Ei kukaan ole saanut minua niin raiteiltaan kuin sinä.
      Ikävä
      22
      1326
    6. Mainehaitta metsäkonefirmalle

      Hukkajoen tapahtumista liikkuu paljon huhuja. Eikö kannattaisi julkaista raakkuja tuhonneen metsäkoneyrityksen nimi, kos
      Suomussalmi
      53
      1218
    7. Oho! Maajussi-Kallelta pakit saanut morsioehdokas Miss Suomi -kisoissa! Tunnistaisitko hänet nyt?

      Hmm, tunnistaisitko?!? Onnea missihulinoihin! Lue lisää ja katso kuvat: https://www.suomi24.fi/viihde/oho-maajussi-
      Suomalaiset julkkikset
      0
      1075
    8. Myönnän sinulle nyt

      Että olen erittäin mustasukkainen sinusta jo nyt. Ikävä on tämä tunne, kun tietämättömyyden solista nousee myrkkyä miele
      Ikävä
      54
      1000
    9. Pysytäänkö nainen

      edelleen yhtä viileän tyynenä kun nähdään. Uskotko että tahtoessani saisin murettua tyyneytesi hyvin helposti.
      Ikävä
      57
      885
    10. Olen käyttäytynyt ristiriitaisesti

      eikä minusta varmaankaan ota mitään selvää. Se johtuu siitä, kun järki sanoo ei, ei, ei ja sydän sanoo kyllä, kyllä, kyl
      Ikävä
      60
      859
    Aihe