Tämä tuntuu piinavan usein: CSS:llä luotuun boksiin laitettu kuva menee "boksin yli", eli boksi ei veny kuvan mukaan jos teksti tai muu elementti ei ole kuvaa pidempi ja venyttämässä sitä kuvan puolesta.
Onko jotain yleistä virhettä, jonka teen kun kuva ei venytä boksia?
Jos kuvalla on esimerkiksi float-arvo, sen isäntäelementti ei veny kuvan mukaan. Toisaalta olet voinut rajoittaa laatikon koon johonkin tiettyyn arvoon, jolloin se ei voi edes venyä.
Joo eli jos kuvalle ei anna align/float-arvoa, se toimii oikein mutta niiden kanssa ei. Miten sitten sen saa toimimaan, jos haluan laittaa kuvan oikealle ja tekstin rivittymään vasemmalle?
Laita kuvan jälkeen elementti, jolla on sopiva clear-tyyli. Usein tähän sopii pseudoelementti #boksi:after.
#boksi:after { clear: right; }
Ei toimi. Ei mitään muutosta.
Edit: Onnistun tekemään vain tämän muutoksen, eli alla oleva boksi väistyy kuvan tieltä, mutta ylempi boksi, jossa kuva on, ei veny kuvan mittaiseksi. http://reference.sitepoint.com/css/floatclear
#boksi:after { display: block; content: ''; clear: right; }
No nyt toimii! Kiitos!
Aihe on jo aika vanha, joten et voi enää vastata siihen.