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

654

    Vastaukset 5

    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ä.

    Luetuimmat keskustelut

    1. Onko sulla rakas mitään sanottavaa?

      Lähetä tässä kaivatullesi haluamasi terveiset 💌
      Ikävä
      270
      2204
    2. Nanna hakkasi Martinan aivot tuusan nuuskaksi!!!

      Ihme jos Martina pystyy muodostaa järkeviä lauseita tämän nyrkkisateen jälkeen. Ottelupalkkio tuli, tajunta meni.
      Kotimaiset julkkisjuorut
      266
      1301
    3. Liikenneonnettomuus kuhmo

      Taisi Audi mennä lunastukseen ja pemari kilometritehtaalle
      Kuhmo
      22
      1284
    4. Oot sä aika nuorekas...

      Vaikka oot niin vanha!
      Ikävä
      41
      836
    5. Vaikea löytää samantyylistä miestä

      Nyt on pakko avautua. Onko ketään muuta jonka on yksinkertaisesti todella vaikeaa löytää samanhenkistä kumppania kuin i
      Sinkut
      137
      791
    6. Martina ja Muhis

      Aamulenkillä yhdessä valmistautumassa suuren päivään,toivottavasti heräsivät toistensa viekusta.Ihana pariskunta❤
      Kotimaiset julkkisjuorut
      237
      719
    7. Rasismi ahdistaa.

      Tapasin baarissa oikein lupsakan oloisen miehen, mutta arvomaailma on hyvin erilainen omani kanssa. Hän käyttää n-sanaa
      Sinkut
      240
      715
    8. Näin sut.

      olitpas vanhentuneen näköinen. 😆 mieheltä naiselle
      Ikävä
      55
      547
    9. Olenkohan tunteideni kanssa yksin?

      Salaa toivon, että sinä nainen luotat minuun niin paljon, että uskaltaisit lähentyä kanssani, vaikka tämä on vähän kiell
      Ikävä
      46
      481
    10. Oot pelkkä naurun aihe

      🤣🤣🤣🤣🤣 m-n
      Ikävä
      38
      468
    Aihe