Not just rotated cells but cells with input elements inside that grow or shrink to match the cell dimension Also updating all cells so they are correct Option to rotate 90 deg clockwise or counterclockwise Align to the top or bottom style box sizing border box body min height 500px table td tr border 0px dashed gray position relative tr td width 30px height 30px input resize none width 30px height 30px text align center vertical align middle padding 0px margin 0px display flex align items center justify content center background color yellow position absolute left 0px top 0px outline 0 border 0 padding 20px text align left style script let nx 5 let ny 5 var table document createElement table document body appendChild table for let y 0 y ny y var row table insertRow 1 for let x 0 x nx x var cell row insertCell 1 cell innerHTML x nx y let ta document createElement input ta className myinput cell appendChild ta ta value x nx y ta oninput change rotate 90 if x 0 x nx 1 y 0 y ny 1 ta style transform origin top left ta style transform rotate 90deg translate 100 0 ta style background color rgba 0 255 0 0 2 if y 0 top ta style text align left else ta style text align right else if x 0 y 0 x nx 1 y 0 x 0 y ny 1 x nx 1 y ny 1 ta value ta style background color lightgray else if x 0 x nx 1 y 0 y ny 1 ta style background color orange else ta maxLength 1 rotate 90 if x 0 y ny 1 ta style transform origin top left ta style transform rotate 90deg translate 0 100 ta style background color rgba 0 255 0 0 2 ta style text align left end x end y function change let tas document getElementsByClassName myinput tas tas tas forEach ta ta style width 0px ta style height 0px ta parentElement style width 0px ta parentElement style height 0px for let n 0 n 2 n let tas document getElementsByClassName myinput tas tas tas forEach ta if ta style transform ta parentElement style height ta scrollWidth px ta style width ta scrollWidth px ta style height ta parentElement offsetWidth px ta style width ta parentElement offsetHeight px else ta style width 100 ta style height 100 ta style width ta scrollWidth px ta style height ta scrollHeight px ta parentElement style width ta scrollWidth 0 px ta parentElement style height ta scrollHeight 0 px end tas for n end change change script
y 0 x 0 y ny 1 x nx 1 y ny 1 ta value ta style background color lightgray else if x 0 x nx 1 y 0 y ny 1 ta style background color orange else ta maxLength 1 rotate 90 if x 0 y ny 1 ta style transform origin top left ta style transform rotate 90deg translate 0 100 ta style background color rgba 0 255 0 0 2 ta style text align left end x end y function change let tas document getElementsByClassName myinput tas tas tas forEach ta ta style width 0px ta style height 0px ta parentElement style width 0px ta parentElement style height 0px for let n 0 n 2 n let tas document getElementsByClassName myinput tas tas tas forEach ta if ta style transform ta parentElement style height ta scrollWidth px ta style width ta scrollWidth px ta style height ta parentElement offsetWidth px ta style width ta parentElement offsetHeight px else ta style width 100 ta style height 100 ta style width ta scrollWidth px ta style height ta scrollHeight px ta parentElement style width ta scrollWidth 0 px ta parentElement style height ta scrollHeight 0 px end tas for n end change change script