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

540

    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. Kenellä oli ryppyinen paita, josta Halla-aho mielensä pahoitti?

      Ei ollut Keskisarja, jonka paita vain repsotti housujen päällä puolittain. Muistatteko tapausta?
      Maailman menoa
      54
      3148
    2. Miksi Halla-aho on niin hyvin menestynyt - mutta punavihreä ei?

      Hyvin näkee kuinka punavihreää ottaa pahasti päähän kun Virta on taas töppäillyt pahasti. Ja kun punavihreä ei pärjää, n
      Maailman menoa
      55
      2339
    3. Ruoan arvonlisävero menee käytännössä tukijussille

      Ilman juomia elintarvikkeiden myynti vuonna 2025 oli reilut 15 miljardia euroa. Tuolla tasolla arvonlisävero pyörii pari
      Maailman menoa
      75
      2230
    4. Vihreät REPEÄMÄSSÄ oijoijoi....Virran sekoilut on liikaa

      Jo ennestään vihreiden kannatus on suossa vaikka puolue istuu oppositiossa, nyt tuli Virran temppu kun häipyi tuosta vaa
      Maailman menoa
      106
      2146
    5. Poliisi tutkii keskiviikkoiltana Kiuruveden keskustassa tapahtunutta väkivallantekoa.

      Itä-Suomen poliisi tutkii Kiuruveden keskustassa keskiviikkoiltana tapahtunutta epäiltyä väkivallantekoa. Tapaus on herä
      Kiuruvesi
      26
      2138
    6. Ruotsissa uusi vakava ongelma: Vanhusten seksuaalinen hyväksikäyttö

      palvelutaloissa ja kotihoidossa. Tämäkin on ihan puhtaasti väärän maahanmuuton vaikutusta, sillä tekijät ovat kaikki keh
      Maailman menoa
      72
      1862
    7. Työeläkkeiden maksaminen lopetettava ASAP.

      "Vanhimmat sukupolvet ovat saaneet vastinetta eläke­maksuilleen monin­kertaisesti nykyisiin ja tuleviin sukupolviin verr
      Maailman menoa
      97
      1613
    8. Mika Poutala salasi osallistumisensa Erikoisjoukkoihin

      Poutala ryhtyi ministeriksi 13.6.2025 ja 5.8.2025 ilmoitettiin hänen olevan seuraavalla Erikoisjoukot-kaudella. http
      Maailman menoa
      60
      1379
    9. Siis HYI OLKOON! Ihmiset, eikö enää ole mitään rajaa?

      https://www.iltalehti.fi/viihdeuutiset/a/4142eeb2-a589-4109-a5d0-e8f341df585c "Susanna Penttilän seksibussi kauhistutta
      Maailman menoa
      141
      1331
    10. Puuma Martina iski nuoren miehen

      Martina ja Hajji Muhis oikealta nimeltään Muhammad Abdilrasoon hempeilivät Tallinnassa. Hajji 28 vuotias ja Martina pian
      Kotimaiset julkkisjuorut
      177
      1201
    Aihe