Pitäisi saada kaikista kuvista neliöitä, niin että leikattu osa oli keskeltä:
http://s26.postimg.org/3plhlrupl/crop.png
Eli ihan sama onko kuva vaaka vai pystysuunnassa, siitä tulisi tuollainen neliö.
Onko ideoita miten tämä onnistuisi CSS avulla?
Kuvan croppaus CSS avulla
6
517
Vastaukset
- 0smo
Seuraava yksinkertainen konsti tulee mieleen: pyydetään kuvat tyhjien elementtien taustakuvina siten että elementtien koot asetetaan halutun neliön mukaiseksi ja taustakuvien sijainti keskelle (background-position:center).
- CSSääää
Tästä vois saada soveltamalla. Nytkin toimii (kait) ok, mutta kuvat pitää jakaa kahteen luokkaan, riippuen onko pysty- vai vaakakuva.
----------
body {
background: #fff;
color: #000;
}
div.img {
position: relative; float: left;
padding: 0; margin: 20px;
width: 150px;
height: 150px;
border: 5px solid #ff6600;
overflow: hidden;
}
div.img img.pysty, div.img img.vaaka {
position: absolute;
margin: auto;
left: -100%;
right: -100%;
top: -100%;
bottom: -100%;
}
div.img img.pysty {
width: 150px;
height: auto;
}
div.img img.vaaka {
width: auto;
height: 150px;
}- Jätti hakasulkeita
pois joten jos kokeilet, lisää ne css.ään.
- kulmasulkeet
Jätti hakasulkeita kirjoitti:
pois joten jos kokeilet, lisää ne css.ään.
Älä nyt sentään hakasulkeita ( [ tai ] ) lisää :)
Kulmasulkeet ( < tai > ) ovat ne mitä pitää lisätä - Kulmasulkeet
kulmasulkeet kirjoitti:
Älä nyt sentään hakasulkeita ( [ tai ] ) lisää :)
Kulmasulkeet ( < tai > ) ovat ne mitä pitää lisätäTai tosin tässä tapauksessa aaltosulkeet ( { ja } )
- CSSääää
Kulmasulkeet kirjoitti:
Tai tosin tässä tapauksessa aaltosulkeet ( { ja } )
Aina ei voi onnistua laakista mutta hyvä kun korjasit ;)
Ketjusta on poistettu 0 sääntöjenvastaista viestiä.
Luetuimmat keskustelut
- 843252
- 751301
Kalasataman talossa lienee rakennusvirhe
Ei pitäisi olla mahdollista parvekkeen kautta tulipalon kiivetä katolle saakka kuin korkeintaan ylimmästä kerroksesta.1801236Kristillinen Kaste on syntisten kaste, ei itsensä uskoviksi julistaneiden kaste
Raamatun mukaan vain syntisyyden vuoksi kastetut saavat kasteen hyödyn, syntien anteeksisaamisen ja Pyhän Hengen lahjan2401040Kaipaatko nainen
Semmoista tosi hankalaa ja arkaa miestä? Pitäisitkö hänet aina omanasi jos saisit hänet? Miten huomioisit hänen herkkyyd103971Venäjä teki mahtavan iskun Kiovaan?
Miksi Ukraina ei kykene tekemään Moskovaan yhtä mahtavia iskuja.310942- 95857
- 43849
Milloin ymmärsit
Milloin tunnistit, että sinulle kirjoitetaan ja kuka kirjoittaa? Tarkka päivämäärä ja kellonaika 😉 Önnönnöö, jos ei os78835Nojatuoli !
Uutta kehiin, kun edellinen pikavauhtia täyttyi, pitäisikö kiittää näitä asian jouduttaneita? Pilvet leijaa, sadetta en124825