Termosta vuan!
Eli olen vuodesta x asti tottunut tekemään sivut table td virityksillä, mutta nyt 06 vuoden kunniaksi koitan parantua tästä sairaudesta ja omaksua tavan toteuttaa sivut diveillä.
Ongelmana on se että käyttämäni selain (Opera) näyttää sivun ihan hookoo jopa ie näyttää sivut oikein (viides ihme), mutta jostain syystä firefox päästää tekstin "ulkoasun" päälle.
http://www.elektroniikka.org/sivu/
Neuvoja / vinkkejä / parannusehdotuksia. Otan kaikkea mielelläni vastaan.
Tee aluksi vaikkapa validia koodia.
Ongelma saattaa johtua mm. siitä, että sinulla on otsikko (<h1>) kappaleen (<p>) sisällä.
Nyt on validia. Nämä ei ainakaan vaikuttaneet ongelmaan.
Vaihda div.contentin leveys 557 pikseliin. Nyt se on 777 pikseliä. Ongelmana on se, että sinulla on 110 pikseliä paddingia kummallakin puolella, jotka lisätään div.contentin leveyteen. IE ajattelee width-attribuutin siten, että se on yhteenlaskettu leveys, Firefox ja suurin osa muista selaimista siten, että se on vain sisällön leveys.
Tuo taustapalkki on juurikin jotain 550 pikseliä leveä. IE:n kanssa joudut kikkailemaan, jotta saat sen näkyviin oikein (Googlaa "IE box model hack" tms), Operan käyttäytyminen taas hämmästyttää minua, joten siitä en sano mitään.
Jaa, mistähän p-elementistä Deewiant puhui? b-elementiltä (heh) tuo näyttäisi. Muutosta suosittelisin.
Taitaa johtua siitä, että FF:llä width on se leveys, jonka sisällä sisältöä on, ja padding tulee ilmeisesti tämän ulkopuolelle.
Jos on pakko tuollainen reuna tunkea sivulle, niin tungettakoon se omaan diviinsä. Eli tee reunat omina diveinään ja jätä keskelle div ilman sisältöä. Vaihtoehtona kelvannee se, että otat tuosta divistä paddingit ja muut pois ja laitat sen sisälle toisen divin, jolla on sopiva margin ja johon sisältö tulee.
CSS-taitto menettää suuressa määrin merkityksensä, kun sisällöstä tehdään vakiolevyinen. Saman tien voit käyttää taulukoita, jos et tee skaalautuvaa sivua.
Metabolix kirjoitti:
Jaa, mistähän p-elementistä Deewiant puhui? b-elementiltä (heh) tuo näyttäisi. Muutosta suosittelisin.
Huomaat, että sivu muuttui aikojen 19:14:26 ja 19:22:12 välillä. Muistaakseni <p> ulottui kaiken ympärille divin sisällä.
lainaus:
Vaihtoehtona kelvannee se, että otat tuosta divistä paddingit ja muut pois ja laitat sen sisälle toisen divin, jolla on sopiva margin ja johon sisältö tulee.
Tämä toimi halutulla tavalla. Kiitän!
tästä tuli mieleen kysymys, että saakos div:in venymään tekstin mukana kuin tablen? ie:n kanssahan tuo venyy, mutta firefoxilla teksti menee yli.
display: table; Saattaa tosin aiheuttaa jotain sivuvaikutuksia.
Aihe on jo aika vanha, joten et voi enää vastata siihen.