div-elementit

hypertextmarkuplanguage

Miten HTML:ssä voi CSS:ää käyttämällä sijoitella div-elementtejä / lohkoja / laatikoita eri puolille html-dokumenttia?

Olen toistaiseksi pystynyt sijoittelemaan niitä ainoastaan pystysuoraan.

1

477

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • Jaska Perusjaksa

      No, ainahan voit antaa niin diville kuin mille tahansa muullekin elementille css:ssä määrityksen position:absolute ja top, bottom, left ja right -arvoilla sijainnin ruudun reunoista.

      Esim.




      #iBox {
      position: absolute;
      top: 25px;
      left: 25px;
      height: 25px;
      width: 25px;
      background-color: #ff0000;
      }

      Tekee 25x25 px kokoisen punaisen boksin 25 px päähän ruudun ylä- ja vasemmasta reunasta.

      Tämä ei ole tosin pitkällä tähtäimellä tai edes lyhyellä aina kovinkaan hyvä ratkaisu.

      Kun oppii html-rakenne-ajattelutavan, ei tarvitse juurikaan koskaan absoluuttisia tai edes relatiivisia sijaintimäärityksiä. Jo leiskaa suunnitellessa pystyy miettimään koodin rakennetta ja välttämään sellaisia juttuja, joiden rakentaminen on hankalaa. Tai ainakin voi jo etukäteen miettiä, jos ongelmaan olisi parempi ratkaisu. Leiskausvaiheessa muutokset on vielä helppo tehdä.

      Eli käytännössä sisäkkäiset divit, marginaalit ja paddingit sekä float riittää useinmiten elementtien sijoitteluun. Nykyään on alkanut päästä irti jopa ylimääräisistä diveistäkin.

      Tai no se on minun tapani tehdä sivuja. Tuskin on ainoa, eikä välttämättä edes paras tapa. Mutta ainakin niin kauan kun ei tarvitse muiden leiskoja koodata, se toimii erinomaisesti.

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

    Luetuimmat keskustelut

    1. Maahanmuuttajien vaikutus Suomen valtiontalouteen positiivinen

      Maahanmuuttajat maksavat enemmän tuloveroja kuin saavat tulonsiirtoja. Eroavat persuista tässä suhteessa. Persuista o
      Maailman menoa
      195
      3807
    2. Uusin tutkimus: Suomi on maailman toiseksi vähin rasistinen maa

      taakse jää mm. Ruotsi(7) ja Norja(8). Martin Paasi(kok.): Kumoaa vasemmiston väitteet. Kansainvälinen vertailu osoitta
      Maailman menoa
      81
      2076
    3. Ukrainan tiedustelun huippupotti - Iski ensin yhteen satamaan, sitten toiseen

      Ukrainan tiedustelupalvelu SBU kertoo johtaneensa operaatiota, jossa on isketty drooneilla Venäjän tärkeimpiin satamiin
      Maailman menoa
      82
      2013
    4. Ketkä 8 Ähtärin luottamushenkilöä saivat syytteen virka_aseman väärinkäyttämisestä?

      Nyt näiden valtuutettujen nimet esiin, kiitos! Nämä henkilöt pitää yksinkertaisesti laittaa syrjään Ähtärin kaupunginva
      Ähtäri
      48
      1936
    5. Ulkomaalaistaustaiset tulevat kalliiksi yhteiskunnalle.

      Selvitys: Ulkomaalaistaustaiset saivat selvästi enemmän työttömyysetuuksia ja toimeentulotukea kuin suomalaistaustaiset.
      Maailman menoa
      82
      1876
    6. Ähtärin päättäjät

      Nyt tulee kutsu leivättömän pöydän äärelle. Syytteet nostetaan. https://www.iltalehti.fi/kotimaa/a/cef83309-0a1b-4fcd-9b
      Ähtäri
      62
      1603
    7. Oletko tosiaan niin

      matalalla älykkyydellä varustettu että et tajua miten sua vedätetään? Kun susta ei tykätä.
      Viha
      142
      1066
    8. Arkkipiispa Tapio Luoma sanoo olevansa syvästi huolissaan lisääntyvästä rasismista ja islamofobiasta

      Tarvitsemme ymmärrystä ja uskontojen lukutaitoa erilaisia perinteitä kohtaan. Rauhallinen rinnakkaiselo ja toinen toisem
      Maailman menoa
      276
      956
    9. Millaisia toiveita

      Sinulla on minun suhteeni?
      Ikävä
      67
      894
    10. Oikea mies ei katoa elämästä silloin

      Kun on vaikeaa. Väärä mies pysyy elämässä niin kauan kun aurinko paistaa ja on mukavaa. Mutta kuka jää elämään silloi
      Ikävä
      98
      826
    Aihe