kaksi div boxia samalla rivillä

yung

Miten saadaan css:llä kaksi div boxia samalle rivillä, että nämä olisivat kiinni toisissaan (ja riippuvaisia selaimen leveydestä).

20% ja 80% pituuksista ei ole tässä vaiheessa hyötyä - ainakaan yksinään.

Eli mitä tyylejä nämä div boxit tarvitsevat, jotta ne olisivat kiinni toisissaan?

Alla on lähdekoodi, jota käytän tulevilla sivuillani (jotka eivät ole vielä netissä).


Moikka
Jotain tekstiä



Moikka
Lisää tekstiä

5

638

Äänestä

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • Ridge

      Olisko näin..?

      #leftbox {
      width: 20%;
      float:left;
      background-color: #eee;
      }
      #rightbox {
      width: 80%;
      float:right;
      background-color: #ddd;
      }

      • weppimasteri_web

        Kaikki selaimet eivät näytä tuota oikein; jos yhteisleveydeksi määritellään 100%, saatetaan toinen boksi heittää ensimmäisen alle. Kannattaa määritellä yhteisleveydeksi 99%, jolloin pitäisi toimia kaikilla selaimilla.

        Eli näin:

        #leftbox {
        width: 20%;
        float:left;
        background-color: #eee;
        }
        #rightbox {
        width: 79%;
        float:left;
        background-color: #ddd;
        }


        Sitten laitat vaikka body-elementille saman taustavärin kuin rightboxille.

        Itse en juuri näistä toimivuus syistä käytä div-elementtejä. Kun selaimet näyttävät ne eri tavalla. Tarvitaan hyvin laaja tietämys, jotta saisi diveillä monimutkaiset sivut (rakenteeltaan) juuri niin kuin pitäisi. Siksipä itse tyydyn tableihin, sanoi muut mitä haluaa. Varsinkin nyt nopeiden internet-yhteyksien aikakautena niiden käyttö on mielestäni aivan OK.

      • yung
        weppimasteri_web kirjoitti:

        Kaikki selaimet eivät näytä tuota oikein; jos yhteisleveydeksi määritellään 100%, saatetaan toinen boksi heittää ensimmäisen alle. Kannattaa määritellä yhteisleveydeksi 99%, jolloin pitäisi toimia kaikilla selaimilla.

        Eli näin:

        #leftbox {
        width: 20%;
        float:left;
        background-color: #eee;
        }
        #rightbox {
        width: 79%;
        float:left;
        background-color: #ddd;
        }


        Sitten laitat vaikka body-elementille saman taustavärin kuin rightboxille.

        Itse en juuri näistä toimivuus syistä käytä div-elementtejä. Kun selaimet näyttävät ne eri tavalla. Tarvitaan hyvin laaja tietämys, jotta saisi diveillä monimutkaiset sivut (rakenteeltaan) juuri niin kuin pitäisi. Siksipä itse tyydyn tableihin, sanoi muut mitä haluaa. Varsinkin nyt nopeiden internet-yhteyksien aikakautena niiden käyttö on mielestäni aivan OK.

        Taidan itsekin harkita taulukkojen käyttöä. Kokeilin tuota koodia itse (tosin rightbox oli right floatilla) ja huomasin selkeän eron heti firefoxilla ja operalla. firefox heitti rightboxin leftin alle kun tämä laitettiin koko näytön kokoiseksi mutta opera laittoi sen sivulle (mutta selainta kaventaessa tällöin rightbox työntyi heti leftin alle).

      • Ridge
        weppimasteri_web kirjoitti:

        Kaikki selaimet eivät näytä tuota oikein; jos yhteisleveydeksi määritellään 100%, saatetaan toinen boksi heittää ensimmäisen alle. Kannattaa määritellä yhteisleveydeksi 99%, jolloin pitäisi toimia kaikilla selaimilla.

        Eli näin:

        #leftbox {
        width: 20%;
        float:left;
        background-color: #eee;
        }
        #rightbox {
        width: 79%;
        float:left;
        background-color: #ddd;
        }


        Sitten laitat vaikka body-elementille saman taustavärin kuin rightboxille.

        Itse en juuri näistä toimivuus syistä käytä div-elementtejä. Kun selaimet näyttävät ne eri tavalla. Tarvitaan hyvin laaja tietämys, jotta saisi diveillä monimutkaiset sivut (rakenteeltaan) juuri niin kuin pitäisi. Siksipä itse tyydyn tableihin, sanoi muut mitä haluaa. Varsinkin nyt nopeiden internet-yhteyksien aikakautena niiden käyttö on mielestäni aivan OK.

        Voihan sen näinkin laittaa, toimii bordereillakin ja leveys on 100%...

        #leftbox {
        width: 20%;
        float:left;
        background-color: #eee;
        border: 1px solid #000;
        }
        #rightbox {
        margin-left: 20%;
        background-color: #ddd;
        border: 1px solid #000;
        }

      • Teme__
        weppimasteri_web kirjoitti:

        Kaikki selaimet eivät näytä tuota oikein; jos yhteisleveydeksi määritellään 100%, saatetaan toinen boksi heittää ensimmäisen alle. Kannattaa määritellä yhteisleveydeksi 99%, jolloin pitäisi toimia kaikilla selaimilla.

        Eli näin:

        #leftbox {
        width: 20%;
        float:left;
        background-color: #eee;
        }
        #rightbox {
        width: 79%;
        float:left;
        background-color: #ddd;
        }


        Sitten laitat vaikka body-elementille saman taustavärin kuin rightboxille.

        Itse en juuri näistä toimivuus syistä käytä div-elementtejä. Kun selaimet näyttävät ne eri tavalla. Tarvitaan hyvin laaja tietämys, jotta saisi diveillä monimutkaiset sivut (rakenteeltaan) juuri niin kuin pitäisi. Siksipä itse tyydyn tableihin, sanoi muut mitä haluaa. Varsinkin nyt nopeiden internet-yhteyksien aikakautena niiden käyttö on mielestäni aivan OK.

        " Tarvitaan hyvin laaja tietämys, jotta saisi diveillä monimutkaiset sivut (rakenteeltaan) juuri niin kuin pitäisi."

        Ei se divien käyttö nyt niin monimutkaista ja vaikeaa ole. Omilla sivuillani (www.skitta.net) niitä käytän ja ei ole mitään ongelmaa

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

    Takaisin ylös

    Luetuimmat keskustelut

    1. Räppäri kuoli vankilassa

      Ei kuulemma ole tapahtunut rikosta. Sama vahinkohan kävi Epsteinille. https://www.hs.fi/suomi/art-2000011840869.html "
      Maailman menoa
      87
      4028

    2. Välillä kyllä tuntuu, että jaat vihjeitä

      Mutta miten niistä voi olla ollenkaan varma? Ja minä saan niistä kimmokkeen luulemaan yhtä sun toista. Eli mitä ajatella
      Ikävä
      24
      2891

    3. No kyllä te luuserit voitte tehdä mitä vaan keskenänne, sitä en ymmärrä miksi pelaat,nainen

      Pisteesi silmissäni, edes ystävätasolla tippui jo tuhannella, kun sain selville pelailusi, olet toisen kanssa, vaikka ol
      Ikävä
      45
      2310

    4. Missä näitte viimeksi?

      Missä näit kaivattua viimeksi ja oliko sähköä ilmassa?
      Ikävä
      34
      1311

    5. Puukotus yöllä

      Oli kaveri hermostunut ja antanut puukosta.
      Sotkamo
      10
      899

    6. Mitä sun kaltainen ihminen tekee tämmöisessä paikassa?

      Et kuulu tänne?
      Ikävä
      131
      875

    7. rakas J siellä jossain

      Niin ikävä sua. -P. Nainen
      Ikävä
      6
      844

    8. Masan touhut etenee

      Punatiilitalon tietotoimiston mukaan Masa on saanut viimein myytyä kämppänsä ja kaavoittaa uudelle lukaalille tonttia pa
      Äänekoski
      12
      811

    9. Naisten ja miesten tasoeroista

      Oletteko huomanneet, että naisissa ylemmän tason naiset ovat sinkkuja, ja miehissä alemman tason incelit? Toimivat paris
      Ikävä
      124
      756

    10. You've been running and

      so has your mind, I'm thinking of you all the time... 💘
      Ikävä
      11
      750
    Aihe
    TietosuojaselosteKäyttöehdotEvästeasetuksetSäännöt