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
248
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
YLE Äänekosken kaupunginjohtaja saa ankaraa arvostelua
Kaupungin johtaja saa ankaraa kritiikkiä äkkiväärästä henkilöstöjohtamisestaan. Uusin häirintäilmoitus päivätty 15 kesä921949Euroopan lämpöennätys, 48,8, astetta, on mitattu Italian Sisiliassa
Joko hitaampikin ymmärtää. Se on aivan liikaa. Ilmastonmuutos on totta Euroopassakin.2781781Asiakas iski kaupassa varastelua tehneen kanveesiin.
https://www.iltalehti.fi/kotimaa/a/33a85463-e4d5-45ed-8014-db51fe8079ec Oikein. Näin sitä pitää. Kyllä kaupoissa valtava3081584Martina lähdössä Ibizalle
Eikä Eskokaan tiennyt matkasta. Nyt ollaan jännän äärellä.1851460Jos ei tiedä mitä toisesta haluaa
Älä missään nimessä anna mitään merkkejä kiinnostuksesta. Ole haluamatta mitään. Täytyy ajatella toistakin. Ei kukaan em921053- 511007
- 56987
Se nainen näyttää hyvältä vaikka painaisi 150kg
parempi vaan jos on vähän muhkeammassa kunnossa 🤤56978- 67954
Miksi mies tuntee näin?
Eli olen mies ja ihastuin naiseen. Tykkään hänestä ja koskaan hän ei ole ollut minulle ilkeä. Silti ajoittain tunnen kui40941