Cut out text in CSS. Possible? -



Cut out text in CSS. Possible? -

this question has reply here:

how apply inverse text mask css 3 answers

say, have:

<div class="outer"> <div class="inner"> <span class="text">hello!</span> </div> </div>

the 'outer' div has linear gradient background. 'inner' div has bluish background. possible create text color same color of 'outer' div. sort of text mask effect:

you can false using text transparency kp mentioned. first, apply same gradient span have on outer div. then, apply bluish background inner div , text it's been knocked out. have sample fiddle here. here's article details technique.

remember, first technique not work in ie. if want accomplish similar effect in ie can utilize technique shown here. technique requires png, , markup appear work everywhere. since isn't real text mask, may have play bit right.

update: farther testing shows firefox doesn't display first technique... stick sec it's no longer css, require image.

css

Comments

Popular posts from this blog

delphi - blogger via idHTTP : error 400 bad request -

c++ - compiler errors when initializing EXPECT_CALL with function which has program_options::variables_map as parameter -

How do I check if an insert was successful with MySQLdb in Python? -