Divin taustaväri Firefoxilla

...

Elikkäs, olen luonut tällaisen div-rakenteen:


Eli yhden divin sisällä kaksi pienempää. Kaikille diveille on määritelty taustaväri (ja noille kahdelle sisemmälle myös margin). Internet Explorer näyttää tuon juuri siten, miten olen halunnutkin, eli värillisen laatikon sisässä kaksi pienempää värillistä kivoilla containerin värisillä marginaaleilla. Firefox ei kuitenkaan suostu näyttämään container-divin taustaväriä, vaan se pysyy siis läpinäkyvänä. Mitä voisin tehdä?

7

472

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • väliin sanoa

      todella huonoa tyyliä kirjoittaa sisäkkäin div-elementtejä. Kannattaa miettiä voisitko toteuttaa tuota paremmin niin näkyisi myös standardeja tukevalla selaimella kuten firefox.

    • jokunenvaan

      ne noinkin voi laittaa ja tässä tapauksessa myös container - div:n taustavärin pitäisi näkyä.
      Voitko kertoa miten määrittelet divien ominaisuudet, olisi helpompi lähteä selvittämään ongelmaa.

      • ...

        määrittelin siis id:n, niinkuin taisi jo edellisestä viestistä näkyä. Hyvin samantapaiset koodinpätkät kaikilla, tyyliin:

        #container {
           background-color: #FFFFFF;
           height: auto;
           width: 650px;
           margin-top: 50px;   
           margin-right: auto;
           margin-left: auto;
        }
        #navigation {
           background-color: #FFFFFF;
           height: auto;
           width: 190px;
           float: left;
           margin: 10px;
           text-align: left;
        }

        #content {
           background-color: #E7E7E7;
           padding: 20px;
           float: right;
           width: 400px;
           margin: 10px;
           text-align: justify;
        }


        Ja tosiaan, IE:llä se näytti juuri siltä, miltä halusinkin.


      • jokunenvaan
        ... kirjoitti:

        määrittelin siis id:n, niinkuin taisi jo edellisestä viestistä näkyä. Hyvin samantapaiset koodinpätkät kaikilla, tyyliin:

        #container {
           background-color: #FFFFFF;
           height: auto;
           width: 650px;
           margin-top: 50px;   
           margin-right: auto;
           margin-left: auto;
        }
        #navigation {
           background-color: #FFFFFF;
           height: auto;
           width: 190px;
           float: left;
           margin: 10px;
           text-align: left;
        }

        #content {
           background-color: #E7E7E7;
           padding: 20px;
           float: right;
           width: 400px;
           margin: 10px;
           text-align: justify;
        }


        Ja tosiaan, IE:llä se näytti juuri siltä, miltä halusinkin.

        Float-ominaisuus "peittää" alleen uloimman divin taustavärin. Voit kiertää ongelman kun poistat ko. ominaisuuden ja sijoittelet divit marginaalien avulla oikeille paikoille.

        #container {
        background-color: #080808;
        width: 650px;
        margin-top: 50px;
        margin-right: auto;
        margin-left: auto;
        }

        #navigation {
        background-color: #1a34de;
        margin: 10px 100px 10px 10px;
        text-align: left;
        }

        #content {
        background-color: #4e3a2d;
        padding: 20px;
        margin: 10px 10px 10px 310px;
        text-align: justify;
        }


      • ...
        jokunenvaan kirjoitti:

        Float-ominaisuus "peittää" alleen uloimman divin taustavärin. Voit kiertää ongelman kun poistat ko. ominaisuuden ja sijoittelet divit marginaalien avulla oikeille paikoille.

        #container {
        background-color: #080808;
        width: 650px;
        margin-top: 50px;
        margin-right: auto;
        margin-left: auto;
        }

        #navigation {
        background-color: #1a34de;
        margin: 10px 100px 10px 10px;
        text-align: left;
        }

        #content {
        background-color: #4e3a2d;
        padding: 20px;
        margin: 10px 10px 10px 310px;
        text-align: justify;
        }

        ...tuo kyllä auttoi hieman, kiitos. Container tuli näkyviin, mutta Firefoxissa marginaalit eivät toimi myöskään samoin kuin IE:ssä. Kun kokeilin tuota tapaa, IE näyttää marginaalit sellaisena kuin haluan, mutta Firefox ei (ainakaan) top-marginia tee ollenkaan. :o


    • keksa

         #container {width:100%; height:100%; background-color: #080808}
         #nav {width: 200px; height: 400px; background-color: yellow; margin: 10px}
         #content {width: 600px; height: 400px; background-color: blue; margin: 10px}










      mutta firefoxissa taitaa olla vakiona BODYllä jotain marginaalia vakiona. Oletko varma että sisemmät divit mahtuu kokonsa puolesta containerin sisään marginaalien kanssa? Jos pienennät niiden kokoa, niin tuleeko marginaalit näkyviin?

      • ...

        Kyllä tuota koon muuttamistakin - jos ne olivat liian leveitä, ne menivät allekkain, ja pienentelin niitä vaikka kuinka, mutta ei se taustaväri tullut näkyviin.


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

    Luetuimmat keskustelut

    1. Vesikin maksaa, miksei hengitysilma?

      Jatkuvasti itketään ettei ole rahaa mihinkään, mutta tilastojen mukaan rahaa on enemmän kuin koskaan, joten miksei asial
      Maailman menoa
      28
      1828
    2. Satuolennoista tarinointi ei kuulu peruskoulun tehtäviin

      Opetustunteja on muutenkin käytössä vain rajallinen määrä. Eli nämä satuhommat koulun ulkopuolelle vapaaehtoisiin harras
      Maailman menoa
      157
      1802
    3. Suomalainen perheenisä vaatii Suvivirren esittämisestä hyvityksiä

      Itse lapsena uskonnonopetuksesta vissiin traumoja saanut ihka suomalainen (!) perheenisä vaatii Espoon kaupungilta korva
      Maailman menoa
      350
      1545
    4. Mitä haluaisit

      Tehdä kaivattusi kanssa?
      Ikävä
      145
      1160
    5. Mies profiloin sinut

      Etsit täysin hallittavaa mutta samalla poikkeuksellista ihmistä. Etsit jotain mitä et koskaan tule saamaan.
      Ikävä
      213
      1154
    6. Lahkokasteen ja kristillisen kasteen erot

      Raamatun mukaan Kristillisessä yhdessä kasteessa Jumala pesee ja puhdistaa ihmisen sydämen ja poistaa perisynnin kirouks
      Kaste
      422
      1128
    7. Salainen kastekoulutus

      Millainen on helluntailainen kastekoulutus ja kauanko se kestää ?
      Kaste
      285
      995
    8. Känsäkoura ja hotelli

      Tietoa kuka ostanut?
      Kuhmo
      11
      995
    9. Heikki Paasosen Marita-vaimo jätti tunteikkaat jäähyväiset: "Tällä kertaa me..."

      Heikki Paasonen on naimisissa Marita Paasosen (os. Alatalo) kanssa ja heillä on kaksi pientä lasta. Nyt koitti aika jätt
      Suomalaiset julkkikset
      4
      979
    10. Pirkanlinna yleisötapahtuma

      Oli todella hyvä tilaisuus. Ja EERO. L. Aivan mahtava tyyppi. Veti rennosti ja asiallisesti. Ja yleisöltä hyviä kysymyks
      Ähtäri
      49
      938
    Aihe