Voisiko joku CSS-guru avustella minua hieman seuraavanlaisessa ongelmassa. Minulla on sivusto jonka runko-osan tulisi olla minimiltään tietyn korkuinen, mutta skaalautua tarpeen mukaan suuremmaksi. Tähän tietysti onnellisena käytin min-height arvoa, joka toimikin ihan kivasti Firefoxissa, mutta IE:n rontti ei näemmä moista tuekkaan, jolloin koko leiska menee solmuun sivuilla jolla on vähän sisältöä. Jos taas annan elementille pelkän height arvon, niin Firefox ei skaalaa sitä tietenkään isommaksi tarvittaessa(jonka IE taas tekee).
Kysymys siis kuuluukin voiko tämän toteuttaa jollain toisella tapaa, tai muulla tavalla kierosti kiertää?
Eiköhän tuon saa toimimaan perus IE:n hönäytys-kikkareella:
/* aluksi IE:lle height, joka siis toimii IE:ssä kuten min-height normaaliselaimissa */ .divi{ height: 10em; } /* seuraavaa IE ei ymmärrä, mutta kunnon selaimet ymmärtävät */ *>.divi{ min-height: 10em; }
Toinen tapa olisi tehdä esim. 1*1 pikselin kokoinen läpinäkyvä kuva, ja levittää sitä korkeussuunnassa niin isoksi kuin haluat. Tämän jälkeen lisäät tuon kuvan sopivaan kohtaan sen divin alle, jota haluat venyttää (riippuu leiskasta, miten kätevästi tuon saa toimimaan). height- ja min-height jätät siis pois.
Hmm.. Sanoisinpa että mielenkiintoista. Kun kokeilin tuota ajv:n kikkaa, niin tulokset ovat jokseenkin kummalliset. IE kyllä jättää sen huomioimatta sen min-heightin, mutta Firefox toimii niin että se huomioi min-heightin jälkeisen arvon, mutta käyttää sitä elementin normaalina heightina venyttämättä elementtiä tarvittaessa..
/*FireFox, Opera, NetScape*/ .divi{ min-height: 200px; } /*IE only*/ * html .divi{ height: 200px; }
Kiitoksia, nyt toimii.
Aihe on jo aika vanha, joten et voi enää vastata siihen.