Linkkien keskitys ym.

Kummaa

Olen juuri opettelemassa CSS:ää. Tässä on osote, missä voitte tarkastella mun ongelmaa:

http://www.elottomat.org/sivupolut/testi
http://www.elottomat.org/sivupolut/testi.css

Eli:

-Tuo otsikko menee liian alas, jolloin yläpuolelle jää liikaa tyhjää tilaa. Haluaisin sen ylemmäksi. Miten se käy?
-Linkit ei oo keskellä. Miten saisin ne keskelle?
-Yhteystiedot menee tuon laatikon yläreunaan. Tahtoisin ne laatikon keskelle.
-Onko tässä rakennelmassa muuten jotain perustavanlaatuisesti vialla ja olenko käsittänyt jotakin ihan väärin?

Kiitos avusta. CSS vaikuttaa yllättävän helpolta opetella, mutta välillä näyttää tulevan ihan ihme ongelmia.

5

531

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • hiukna vilkaisin ja

      mieleen jäi ainakin

      -Tuo otsikko menee liian alas, jolloin yläpuolelle jää liikaa tyhjää tilaa. Haluaisin sen ylemmäksi.

      Sinähän olet (itse?) sen CSS:ssä määritellyt
      absoluuttisesti juuri tuohon.

      -Linkit ei oo keskellä. Miten saisin ne keskelle?
      -Yhteystiedot menee tuon laatikon yläreunaan. Tahtoisin ne laatikon keskelle.

      No laatikko on 19 px korkea ja teksti 10,
      ei taida systeemi pystyä tekemään puolikkaita
      pikseleitä

    • ChainX

      Tee DIVeille pääsäiliö. Helpottaa esim. keskitystä.
      Käytä position: absoluten sijaan float: left tai right;. Lukitsee DIV:n edellisen säiliön vasempaan tai oikeaan reunaan.
      Älä käytä tai käytä mahdollisimman vähän padding määrettä.

      Alla olevaa koodia soveltamalla pitäisi mm. keskittäminen onnistua ja samalla saat ehkä vähän vinkkiä myös float:n kätevyydestä.



      Tämä teksti on keskellä sivua tai edellistä DIV:ä 500x50px kokoisessa laatikossa.



      laatikko1
      laatikko2
      laatikko3
      laatikko4
      laatikko5

      • Kummaa

        Äh. Olen just vasta opetellut kirjoittamaan css:ää Dream Weawerilla erilliseen css-tiedostoon. Tossa sun esimerkissä noi menee suoraan siihen html- koodin sekaan?

        Voitko kertoilla siis, missä muodossa noi laitetaan sinne css-tiedostoon? Kun voisin opetella yhden asian kerrallaan...


      • ---------
        Kummaa kirjoitti:

        Äh. Olen just vasta opetellut kirjoittamaan css:ää Dream Weawerilla erilliseen css-tiedostoon. Tossa sun esimerkissä noi menee suoraan siihen html- koodin sekaan?

        Voitko kertoilla siis, missä muodossa noi laitetaan sinne css-tiedostoon? Kun voisin opetella yhden asian kerrallaan...

        Nopeesti mitä sinun koodiasi vilkasin, niin siellä on turhia määreitä (siis laitat palstamääreet tyhjälle) Tuommosia ei sit kannata käyttää.

        CSS ei kannata kirjoittaa noin html sekaan muuta kuin esimerkeissä.

        laatikko5

        Tuo menee ihan näin

        laatikko5

        Ja sitten tyyleihin näin.

        #laatikko5 {
        float: left;
        width: 100%;
        height: 400px;
        text-align: left;
        background-color: violet;
        }

        Tuon voi tehdä myös class määreillä kuten sinä olet tehnyt. Tosin selvyyden takia kannattaisi käyttää id määreitä päädiveissä.


      • Kummaa
        --------- kirjoitti:

        Nopeesti mitä sinun koodiasi vilkasin, niin siellä on turhia määreitä (siis laitat palstamääreet tyhjälle) Tuommosia ei sit kannata käyttää.

        CSS ei kannata kirjoittaa noin html sekaan muuta kuin esimerkeissä.

        laatikko5

        Tuo menee ihan näin

        laatikko5

        Ja sitten tyyleihin näin.

        #laatikko5 {
        float: left;
        width: 100%;
        height: 400px;
        text-align: left;
        background-color: violet;
        }

        Tuon voi tehdä myös class määreillä kuten sinä olet tehnyt. Tosin selvyyden takia kannattaisi käyttää id määreitä päädiveissä.

        Joo, pitää kokeilla, että mitenkäs toi onnaa...


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

    Luetuimmat keskustelut

    1. Paras olisi vain unohtaa

      Tuleekohan tähän meidän tilanteeseen ikinä mitään selvyyttä. Epätoivo iskee taas, enkä jaksaisi enää odottaa. Kohta lop
      Ikävä
      81
      1840
    2. Suomalaisia naisia lennätetään seksimatkoille

      https://www.iltalehti.fi/kotimaa/a/1f5f5e20-8c36-4907-9640-8e0c3b017c5a Gambia on jo vuosia ollut yhtä kuin munanhaku ma
      Maailman menoa
      238
      1668
    3. Voisitko laittaa

      Nimesi ensimmäisen ja kaksi viimeistä kirjainta tähän?
      Ikävä
      91
      1523
    4. Mietitikö nainen koskaan

      Miksi me ollaan päädytty tähän pisteeseen. Lähestmistapaa ei ole. Tarvitaanko me oikeasti enää tätä.
      Ikävä
      108
      1341
    5. Nämä kaikki alla olevat aloitukset on saman naisen aloituksia

      Kuinka paljon täytyy vintissä viheltää että esiintyy välillä jopa miehenä, ja sitten itse vastailee omiin kysymyksiinsä?
      Ikävä
      164
      1105
    6. huono omatunto

      johtuu siitä, että minulla on tunteita sinua kohtaan. Se vaikuttaa asiaan. Kaipasin sinua tänäänkin.
      Ikävä
      64
      1083
    7. Päätin juuri että

      En odota että meidän välillä enää tapahtuisi mitään. Tämä on aivan liian monimutkaista ja kyllä sinäkin olisit joskus mi
      Ikävä
      32
      932
    8. Onnistuit sohaisemaan mua

      Kaikkein herkimpään kohtaan ja kyseenalaistamaan mun luottamuksellisuuden. Kun sitä ei ole niin ei ole mitään muutakaan
      Ikävä
      62
      926
    9. Huomenna se

      Tulee kohta, odotatko?
      Ikävä
      61
      866
    10. Mitä kaipaat

      Usein elämässäsi
      Ikävä
      97
      838
    Aihe