Onko mahdollista

mitenkään

tehdä kokoikkunan korkea ? Tarkoituksena on että designilla olisi tietty leveys, mutta korkeus olisi aina 100%. (Eli jotain tuon tapaista: http://kuvagalleria.uutislehti100.fi/ - punainen tausta ja sillä valkoinen pylväs)

Ja tietenkin, että tuo toimisi mahdollisimman monella selaimella

11

589

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • Asetat vain

      html, body, div#jotain {
      height: 100%; padding: 0; margin: 0; }

      ja sitten vain miettimään, mitä oikeastaan on tarkoitus tehdä.

      Tosin jos haluat matkia uutislehti100:n sivun ulkoasua, niin riittää tietysti asettaa sivulle (body) vasen ja oikea täyte (padding) ja haluttu taustaväri ja sivun sisälle div-elementti, jolla on jokin muu taustaväri. Ei siinä mitään korkeuksia tarvitse erikseen asettaa, paitsi jos haluat (miksi?) sivun täyttävän selainikkunan vaikka asiaa on vähemmän kuin ikkunaan mahtuu.

      • minulla ?

        Miksi minulla se ei toimi:

        http://dy.fi/lc

        Mielestäni tein juurin niin kuin sanoit :(


      • minulla ? kirjoitti:

        Miksi minulla se ei toimi:

        http://dy.fi/lc

        Mielestäni tein juurin niin kuin sanoit :(

        Koodistasihan puuttuu olennaisia osia siitä, mitä ohjeessa oli kuten

        html, body { height: 100%; }

        ja lisäksi margin- ja padding-asetukset.

        Sitä paitsi CSS-koodisi on kommentin sisällä, joten XHTML:ää osaava selain saa jättää sen huomiotta. Miksi oikeastaan käytät kommenttimerkkejä style-elementin sisällä?


      • edellinen
        Yucca kirjoitti:

        Koodistasihan puuttuu olennaisia osia siitä, mitä ohjeessa oli kuten

        html, body { height: 100%; }

        ja lisäksi margin- ja padding-asetukset.

        Sitä paitsi CSS-koodisi on kommentin sisällä, joten XHTML:ää osaava selain saa jättää sen huomiotta. Miksi oikeastaan käytät kommenttimerkkejä style-elementin sisällä?

        Nyt ne on korjattu, mutta on edelleen pieni ongelma, sivun ylälaidassa oleva tyhjä tila. Mistä se voisi johtua?

        >Miksi oikeastaan käytät kommenttimerkkejä style-elementin sisällä?

        Siihen on kaksi syytä:

        1. Muistan joskus kauan sitten lukeneeni, että CSS-koodit pitäisi laittaa kommenttimerkkien sisään. Koska kaikki selaimet eivät silloin ymmärtäneet CSS, ja näin ne voineet ohittaa koodin.

        2. Macromedian Dreamweaver laittaa ne oletusarvoisesti.


      • edellinen kirjoitti:

        Nyt ne on korjattu, mutta on edelleen pieni ongelma, sivun ylälaidassa oleva tyhjä tila. Mistä se voisi johtua?

        >Miksi oikeastaan käytät kommenttimerkkejä style-elementin sisällä?

        Siihen on kaksi syytä:

        1. Muistan joskus kauan sitten lukeneeni, että CSS-koodit pitäisi laittaa kommenttimerkkien sisään. Koska kaikki selaimet eivät silloin ymmärtäneet CSS, ja näin ne voineet ohittaa koodin.

        2. Macromedian Dreamweaver laittaa ne oletusarvoisesti.

        Olet ilmeisesti törmännyt suhteellisen harvinaiseen ilmiöön, Firefoxin bugiin. Vai mitähän selainta tarkoitat? Ainakaan IE 7:ssä ei kuvaamaasi tyhjää tilaa ole.

        Firefoxin parantaa tässä asiassa temppu

        #sisalto { outline: solid 1px transparent; }

        P.S. Selaimet, jotka eivät tunnistaneet style-elementtiä, jäivät käytöstä reilut kymmenen vuotta sitten. Mutta kuten mainitsin, XHTML:ssä "kommenteilla suojaaminen" on ihan väärin, koska XHTML:n kannalta kyseessä _ovat_ kommentit, jotka selain saa ohittaa.


      • säätämistä
        Yucca kirjoitti:

        Olet ilmeisesti törmännyt suhteellisen harvinaiseen ilmiöön, Firefoxin bugiin. Vai mitähän selainta tarkoitat? Ainakaan IE 7:ssä ei kuvaamaasi tyhjää tilaa ole.

        Firefoxin parantaa tässä asiassa temppu

        #sisalto { outline: solid 1px transparent; }

        P.S. Selaimet, jotka eivät tunnistaneet style-elementtiä, jäivät käytöstä reilut kymmenen vuotta sitten. Mutta kuten mainitsin, XHTML:ssä "kommenteilla suojaaminen" on ihan väärin, koska XHTML:n kannalta kyseessä _ovat_ kommentit, jotka selain saa ohittaa.

        Firefoxilla ja Operalla näyttää olevan sama juttu:

        Tämä sivu nyt toimii täydellisesti:

        http://dy.fi/14

        Mutta kun yritän laittaa jotain sisältöä siihen "#sisalto" -diviin, niin sivu heti menee heti rikki. En ymmärrä mitä eroa niissä on, miksi se menee rikki?

        http://dy.fi/74z


      • säätämistä kirjoitti:

        Firefoxilla ja Operalla näyttää olevan sama juttu:

        Tämä sivu nyt toimii täydellisesti:

        http://dy.fi/14

        Mutta kun yritän laittaa jotain sisältöä siihen "#sisalto" -diviin, niin sivu heti menee heti rikki. En ymmärrä mitä eroa niissä on, miksi se menee rikki?

        http://dy.fi/74z

        Luultavasti törmäsit toiseen Firefox-bugiin: marginaali menee joskus ulomman elementin marginaaliksi eikä sen elementin, johon se kuuluisi.

        Kun korvaat asetuksen
        margin: 10px;
        asetuksella
        padding: 10px;
        niin tyhjää tulee saman verran mutta elementin _sisälle_, ja silloin ongelmasi korjaantuu.

        (En tietenkään tarkoita, että 10px olisi sopiva mitta, vaan se vain on se, mitä nyt olet käyttänyt.)


      • xkuukkeli
        säätämistä kirjoitti:

        Firefoxilla ja Operalla näyttää olevan sama juttu:

        Tämä sivu nyt toimii täydellisesti:

        http://dy.fi/14

        Mutta kun yritän laittaa jotain sisältöä siihen "#sisalto" -diviin, niin sivu heti menee heti rikki. En ymmärrä mitä eroa niissä on, miksi se menee rikki?

        http://dy.fi/74z

        html, body {
           height: 100%;
        margin-top: 0px;
           padding: 0px;
        }

        MARGIN-TOP: 0PX; tuohon...

        #palsta1 {
        padding-top: 0px;
        margin-left: 10px;
           font: 14px Verdana, Arial, Helvetica, sans-serif;
        }

        PADDING-TOP: 0PX; tuohon...
        MARGIN-LEFT: 10PX; ei pelkkä margin ;o)

        Toimisko nyt?


      • xkuukkeli
        xkuukkeli kirjoitti:

        html, body {
           height: 100%;
        margin-top: 0px;
           padding: 0px;
        }

        MARGIN-TOP: 0PX; tuohon...

        #palsta1 {
        padding-top: 0px;
        margin-left: 10px;
           font: 14px Verdana, Arial, Helvetica, sans-serif;
        }

        PADDING-TOP: 0PX; tuohon...
        MARGIN-LEFT: 10PX; ei pelkkä margin ;o)

        Toimisko nyt?

        Itseasiassa tuon korjaus taitaa riittää,,,

        #palsta1 {
        padding-top: 10px;
        margin-left: 10px;
        font: 14px Verdana, Arial, Helvetica, sans-serif;
        }

        nuo sääteli mistä teksti alkaa...


      • nyt toimii
        Yucca kirjoitti:

        Luultavasti törmäsit toiseen Firefox-bugiin: marginaali menee joskus ulomman elementin marginaaliksi eikä sen elementin, johon se kuuluisi.

        Kun korvaat asetuksen
        margin: 10px;
        asetuksella
        padding: 10px;
        niin tyhjää tulee saman verran mutta elementin _sisälle_, ja silloin ongelmasi korjaantuu.

        (En tietenkään tarkoita, että 10px olisi sopiva mitta, vaan se vain on se, mitä nyt olet käyttänyt.)

        Nyt kaikki toimii, kiitoksia vielä kerran.


    • oksmannnnnnna

      Niin, tuo antamasi esimerkkisivu on ainakin minun selaimessani lähinnä 110% korkea. Eli pikkusen pitää kelailla ennenkuin alalaita näkyy.

      On se vaan niin outoa, kun selain on jo itse 'ikkuna', ja toiset lykkää sen sissän vielä itse vieritettävän ikkunan. Ja toiset taas haluaa että mikään ei ole vieritettävä.

      No, se nuoruus ja kokemattomuus...

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

    Luetuimmat keskustelut

    1. Valkeakosken 15-v tapauksessa ihmettelen ??

      On sääli, että pahoja ihmisiä liikkuu aina vapaana eri puolilla Suomea, mutta minkä ihmeen takia 15-vuotiaan nuoren täyt
      Maailman menoa
      592
      16196
    2. Valkeakosken tappo

      "Tyttö löytyi poliisin mukaan kuolleena läheisestä metsästä muutaman sadan metrin päässä kotoaan. Uhrin löysivät hänen k
      Henkirikokset
      46
      14354
    3. Nyt ahdistaa

      Joku nuori tyttö on surmattu Valkeakoskella. En tunne ihmistä, mutta silti se koskettaa. Uutisissa oli hiljattain, että
      Valkeakoski
      365
      9178
    4. Kuka oli tekijä?

      Jos tekijä oli suomalainen, onko hänen vanhempiaan jo tavoitettu? Mitä mieltä ovat aikamiespoikansa teosta? Entä puoliso
      Valkeakoski
      44
      5005
    5. 15-vuotiaan ruumis valkeakoskella

      Nuoria tyttöjä tappavat miessaalistajat ja toiset nuoret. Miessaalistajille ruumiin kätkeminen tai tuhoaminen ei ole on
      Poliisi
      10
      4397
    6. Valkeakosken murhaaja-raiskaaja on kantasuomalainen mies tiedottaa poliisi

      Some- ja palstapersut ehtivät jo moneen kertaan julistaa tekijän maahanmuuttajaksi. Miten meni niin kuin omasta mielestä
      Maailman menoa
      148
      2801
    7. Kantasuomalainen mies pidätetty - ulkomaalaiset syyttömiä tekoon

      Verityöstä on pidätetty vuonna 2005 syntynyt mieshenkilö. Ulkomaalaisilla ei mitään yhteyttä tekoon.
      Valkeakoski
      108
      1718
    8. Mitä hänellä oli päällään kun viimeksi näit hänet?

      Avoimia vastauksia saa kirjoitella... Ehkä joku saattaa tunnistaa itsensä kommenttien joukosta :)
      Ikävä
      57
      1309
    9. Miksi kaupunki toivoo nuorilta malttia?

      https://www.hs.fi/suomi/art-2000010453236.html "Älkää suunnitelko kostoa" Mistä on kyse? ”Toivomme, että nuorten taho
      Valkeakoski
      41
      1217
    10. Meidän tarinako on ohi?

      Ootko niin päättänyt?
      Ikävä
      90
      1215
    Aihe