javascript オセロ１
「display:inline-blockはうまくいかない fixedを使った」の巻
初心者です。
javascriptでオセロを作る動画を見て、同じように作成してみた。（途中）
その動画で、盤面を作る箇所、
div id = "cell" style = "position:relative;width:33px;height:33px;background-color:#000"
にすると、斜めにマスが表示されるエラーが出たので、
下記のように、
div id = "cell" style = "position:abusolute;width:33px;height:33px;background-color:#000"
にabusoluteにして盤面を作成していた。
が、同じようにすると、縦にマスが左端に一列に並んでしまった。
初心者の想像ですが、divはブロック要素で横並びはできない（工夫がいるのでは）と思いました。
で、下記のように、display:inline-blockを入れてみました。
div id = "cell" style = "display:inline-block;position:abusolute;width:33px;height:33px;background-color:#000"
すると、今度は横一線にマスが並んでしまった。
その動画はIE6で作っているので、（自分はIE11）挙動が違うのかなとか考えました。よく分からず。
で、結局、
div style = "position:fixed:1px;left:1px;width:31px;height:31px;background-color:#00ee00"
にすると、正しく表示されました。
ジャバスクリプトには、
var c = piece[board[x][y]].cloneNode(true);
c.style.left = ((x - 1) * 32) + "px";
c.style.top = ((y - 1 ) * 32) + "px";
このように、座標を取ることが書かれていて、fixed(固定)だと、絶対的な座標で配置してくれるようです。
でも、最後まで作っていないので、同じように作れるかどうか・・・。
追伸
最後まで作りました。
盤面がウィンドウの左上隅にくっついたままで、少し表示がうまくいかなかった。
あと、対コンピュータのスクリプトは、パスの時にも呼べるようにしないといけないのでは？と思いました。
