Text-stroke css for all browsers
|
The Constituent propertiesThis property is a shorthand for the following CSS properties:
SyntaxValuesThe width of the stroke. The color of the stroke. Formal definitionFormal syntax-webkit-text-stroke = ExamplesAdding a red text strokeHTMLCSSResultSpecifications
Browser compatibilityBCD tables only load in the browser See alsoI'm trying the new text-stroke features and I've searched the web for a cross browser solution. For now I only could find it with webkit properties. Could you let me know if there is a way so all browsers will display in the same way?
BoltClock 675k155 gold badges1362 silver badges1334 bronze badges asked May 24, 2012 at 16:10
0 from: Outline effect to text "What I have done instead is used the already supported text-shadow property (supported in Chrome, Firefox, Opera, and IE 9 I believe)."
answered Jun 20, 2013 at 4:36
0 As of May 24th,
2012, there is no cross-browser solution, as only webkit supports the experimental feature according to http://caniuse.com/#search=text-stroke. You can simulate this (to some degree) with 4 or 5 Demo: Text Stroke, on CSS-Tricks.com answered May 24, 2012 at 16:13
SampsonSampson 261k74 gold badges530 silver badges559 bronze badges 0 You could try strokeText.js, a vanilla javascript plugin.
Full disclosure, I made the plugin. answered Dec 11, 2017 at 20:14
inorganikinorganik 23.1k17 gold badges88 silver badges107 bronze badges This can't be done natively cross-browser, but it can be implemented with a fallback for unsupported browsers: That way, webkit browsers will display white text with blue outline, but other browsers will still display the color of your choosing (this case blue). answered Aug 28, 2019 at 21:36
DavidDavid 9281 gold badge12 silver badges19 bronze badges |
