Miten onnistuu divin sijoittaminen keskelle näyttöä. jos esim. divin leveys on 800px, prosenteilla tämän onnistun tekemään mutta en kun leveys on määritelty pikseleillä.
miten onnistuu div sijoittaminen
kysymys
4573
0Äänestä
Muut lukivat myös
Odottaa vastausta
Näihin keskusteluihin ei ole vielä vastattu. Ole ensimmäinen.
Vastaukset 4
Vanhimmat
Olen itse mietiskellyt samaa, kun olen harjoitellut css:n käyttöä. Yhden konstin löysin, mutta se ei ole kovin elegantti:
Tämä div määritellään tyylitiedostossa 800 px leveäksi.
Pystysuuntaiseen keskittämiseen css:llä en olekaan vielä keksinyt keinoa.
muistaakseni tuo vaakatasossa keskittäminen ei edes onnistu css:llä? Pystysuuntaiseen kyllä oli selkeäkin keino, mutten nyt just muista mikä :/
" muistaakseni tuo vaakatasossa keskittäminen ei edes onnistu css:llä?"
Miksei onnistuisi? Sanotaan siellä css-tiedostossa vaikka margin: 0 auto; halutulle elementille. IE5xx(ja mahdollisesti muutama muu selain) ei tätä osaa, joten laitetaan tuo keskitetty elementti ylimääräisen DIVin sisään(align: center).
Ainakin IEllä(5.x) on paha tapa keskittää koko elementin sisältö, joten sille on sanottava erikseen text-align: left;
#keskitetty {
margin: 0;
padding: 2em;
width: 600px;
border: 1px solid #000;
}
#keskitetty h1, p {
text-align: left;
}
ja merkkaus
otsikko
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus erat ante, scelerisque a, commodo ut, mollis quis, elit. Nam tincidunt. Fusce mollis sem vitae nibh. Morbi vestibulum aliquet sapien.
"Pystysuuntaiseen kyllä oli selkeäkin keino, mutten nyt just muista mikä :/"
Itse asiassa sille ei ole mitään vastaavaa "yksinkertaista" keinoa kuin tuo em. margin: auto; Lisäksi ongelmaksi muodostuu määrämittaan taittaminen pystysuunnassa. Käytännössä silloin joudutaan käyttämään overflowta.
Jon Hicks on kirjoittanut asiallisen oppaan esimerkkeineen aiheesta: http://www.hicksdesign.co.uk/articles/archives/000030.php
muistin siis väärin :/ hyvä jos asia kuitenkin selvisi.