2016-12-09 5 views
1

В настоящее время я создаю средство поиска слов, но у меня возникла проблема. Проблема в том, что я использую таблицу с контентоспособной, но как установить максимальную длину строки. Я уже пыталсяКак установить максимальную длину строки в таблице с расширением в HTML?

maxlength="1"

Может кто-нибудь пожалуйста, помогите!

#editor { 
 
    background-color: turquoise; 
 
}
<table border="1" id="editor" width="500px" height="500px"> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
</table>

При работе на фрагмент кода, пожалуйста, перейдите в полноэкранный режим.

Пожалуйста, если есть какие-либо способы, попробуйте избежать jquery!

+3

Несомненно, вы могли бы создать меньший пример? (Что показывает таблица 12x12, показывающая нам, что таблица 4x4 не будет?) – nnnnnn

+3

Я действительно не думаю, что «contenteditable» - это путь сюда. Если вы хотите, чтобы поведение ввода (например, свойство 'maxlength') использовало вход. –

+0

@Corey Ogbum Я уже пробовал это, но мне не повезло, потому что ширина и высота просто не будут следовать вместе с css, который я пробовал. Хотя сейчас, я как бы отказался от этого. – Supercolbat

ответ

2

Вы можете либо изменить те входы, или использовать следующий JavaScript

var pre = onload, doc, T, oneCharOnly; // change pre to another var if using technique on different page 
 
onload = function(){ 
 
if(pre)pre(); 
 
    
 
doc = document; 
 
T = function(n, e){ 
 
    var w = e || doc; 
 
    return w.getElementsByTagName(n); 
 
} 
 
oneCharOnly = function(){ 
 
    var tds = T('td'); 
 
    for(var i=0,l=tds.length; i<l; i++){ 
 
    tds[i].onkeyup = function(){ 
 
     if(!this.innerHTML.match(/^.$/)){ 
 
     this.contentEditable = false; 
 
     } 
 
    } 
 
    } 
 
} 
 
oneCharOnly(); // okay to use on other pages due to scope 
 
    
 
}
#editor { 
 
    background-color: turquoise; 
 
}
<table border="1" id="editor" width="500px" height="500px"> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
</table>

+1

Если вы введете коробку очень быстро, тогда она будет вводить более одной буквы в каждом поле. – Supercolbat

2

Вы можете сделать это с помощью JavaScript:

Пример:

const table = document.querySelector('table'); 
 

 
const validateMaxLength = (event) => { 
 
    const textLength = event.target.textContent.length; 
 

 
    if (textLength > 5) { 
 
    event.preventDefault(); 
 
    } 
 
} 
 

 
table.addEventListener('keydown', validateMaxLength);
#editor { 
 
    background-color: turquoise; 
 
}
<table border="1" id="editor" width="500px" height="500px"> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    <td contenteditable="true">&nbsp;</td> 
 
    </tr> 
 
</table>

+0

Является ли ОП, пытаясь сохранить исходную «ширину» ячеек? – guest271314

+0

@ guest271314 Что значит «OP»? – mattias

+0

Оригинальный пост или оригинальный плакат. – guest271314