CODEWITHSUNDEEP
csswebkitstroke
Filippo oretti
Filippo oretti

Reputation: 49853

CSS- webkit-text-stroke but stroke covers font-color

Please take a look at here using Chrome : http://jsfiddle.net/u8BdB/

Why the webkit-text-stroke is covering also the font color?

I would like to put stroke outside of the text, it seems like it is assumed inside so it covers the font color :/ unbelievable

any help appriciated thanks.

Upvotes: 2

Views: 5843

Answers (2)

Peter Carrero
Peter Carrero

Reputation: 1606

You can do a CSS-based outside text stroke by using ::pseudo-elements. You can actually even do 2 layers of outside stroke.

You can see the technique on http://www.petercarrero.com/examples/stroke/

This method works only for web-kit browsers. The article also mentions a few of the caveats you need to be aware of to get good results.

I hope that helps you.

Upvotes: 3

algiecas
algiecas

Reputation: 2128

This is because the font is relatively small comparing to the 1px stroke.

You can try smaller px value, like 0.3px

Fiddle

Also you can simulate this with text-shadow:

Fiddle

Upvotes: 1

Related Questions