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

523

    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. Petteri Orpo on satusetä

      Väittää että työllisyys on Suomessa samalla tasolla kuin hallituksen aloittaessa kesällä 2023. Fakta on, että työllisi
      Maailman menoa
      137
      3832
    2. Orpo ja Purra, käykää hakemassa oppia Espanjasta

      Espanja on näyttänyt kuinka kova työttömyys nujerretaan ja saadaan maan talous palautettua nousu-uralle. Ei ole häpeä kä
      Maailman menoa
      66
      2702
    3. Porvarimedia: Räsänen vei Lindtmanilta pääministerin paikan

      Lisäksi suomalaiset ovat innostuneet tuhlaaman, koska kuluttavat inflaation verran enemmän rahaa. Eikö porvarimedialla
      Maailman menoa
      49
      2689
    4. Jääkiekon MM:t pitää siirtää MTV:ltä Ylelle

      Persuille ikäviä uutisia taas. . Valtioneuvoston asetuksen mukaan MM-kisat kuuluvat kansallisesti merkittäviin tapahtumi
      Maailman menoa
      85
      2483
    5. Ruotsi laskee jälleen bensaveroa, Riikka irvailee tumput suorana

      Euron bensa oli persujen vaalilupaus, mutta kohta alkaa olla kolmosella alkavia litrahintoja. Meanwhile in Sverige: "
      Maailman menoa
      33
      2350
    6. Olitkin liian hyvää ollaksesi totta nainen

      Ihastuin ja rakastuin, mutta se on minun ongelma. Ei sinun.
      Ikävä
      105
      1458
    7. SE TAPAHTUI - Pekka Aittakumpu: Avioero

      Perussuomalaisten kansanedusta Pekka Aittakumpu käy parhaillaan avioero prosessia. Aittakumpu on siviiliammatiltaan past
      Perussuomalaiset
      82
      1312
    8. Kaste pelastaa ihmisen

      Kristittyjen kirkkojen toimittama yksi Kaste on Jumalan tekemä pelastusteko, jossa perisyntiin hengellisesti kuollut ihm
      Kaste
      637
      1306
    9. Elisalla ja MTV:llä lihava riita - MTV:n kanavienlähetykset ovat katkeamassa Elisan asiakkailla

      Kaikkien MTV:n kanavien televisiolähetykset ovat katkeamassa Elisan kaapeli-tv-asiakkailta. https://www.is.fi/digitoday
      Maailman menoa
      163
      1153
    10. Uskon todistus

      Oikean uskovaisen ja nimikristityn erottaa siitä, että Jeesukseen uskova korottaa Jeesusta ja uskoa Häneen, mutta nimik
      Kaste
      261
      1066
    Aihe