javascript - キャンバス上のテキストのレンダリングが機能しない

Question

私はこのようなものを持っています(ここにもjsfiddleがあります):

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");


canvas.width = 400;
canvas.height = 300;

ctx.beginPath();
ctx.fillStyle = "green";
ctx.fillRect(0, 0, 400, 300);

ctx.fillStlye = "white";
ctx.font = "16px Arial, sans-serif";
ctx.textAlign = "left";
ctx.textBaseline = "top";
ctx.fillText("asdf", 20, 20);

このコードは、四角形に「asdf」を描画することになっていましたが、そうではありません。なんで？