Switch74

<input type="number">

Через F12 в браузере открываете код и инспектируете все элементы Анализируете размеры всех элементов Обратить внимание нужно на border, margin, padding используется ли box-sizing или какие-нибудь float, position все это может влиять на выпадение элементов из родительского или фактические размеры блока например width:100px;padding:10px; будет в ширину 120px а с правильным box-sizing 100px

Для начала закрыть все не закрытые теги (body, table) а там может все и починится

а где по коду выше у вас объявлена переменная ab? должно быть что-то вроде let ab = "текст"; ту же самую ошибку вы потом словите с переменной cba

Ура! Картиночки появились!

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

а как выставляются синие галочки? думаю достаточно будет изменить background-image на нужный url а еще лучше выложите не работающий код в песочнице

У меня проблема с символами, указанными кодами https://htmlforum.dev/uploads/css_built_18/258adbb6e4f3e83cd3b355f84e3fa002_custom.css?v=8a79b5f2331677146702 пытается грузить https://htmlforum.io/uploads/_themes/htmlforum/fonts/fontAwesome.woff2?v=1.8.1 https://htmlforum.io/uploads/_themes/htmlforum/fonts/fontAwesome.woff?v=1.8.1 https://htmlforum.io/uploads/_themes/htmlforum/fonts/fontAwesome.ttf?v=1.8.1 https://htmlforum.dev/uploads/css_built_18/341e4a57816af3ba440d891ca87450ff_framework.css?v=8a79b5f2331677146702 пытается грузить https://htmlforum.io/applications/core/interface/font/fontawesome-webfont.woff2?v=4.7.0 https://htmlforum.io/applications/core/interface/font/fontawesome-webfont.woff?v=4.7.0 https://htmlforum.io/applications/core/interface/font/fontawesome-webfont.ttf?v=4.7.0

можно так попробовать https://codepen.io/cmopkxzy-the-lessful/pen/mdQaGZd

http://htmlbook.ru/html/area на одной картинке можно организовать несколько областей ссылок ведущих на разные страницы

margin внутри таблицы не работает, кста еще можно вот так реализовать так заливка ячеек будет корректно работать, если она нужна будет <table> <tr><td>row 1 cell 1</td><td>row 1 cell 2</td><td rowspan=4>row 1 cell 3<br>must contain<br>several lines</td></tr> <tr><td>row 2 cell 1</td><td>row 2 cell 2</td></tr> <tr><td>row 3 cell 1</td><td>row 3 cell 2</td></tr> <tr><td style="border-top:10px solid #fff;">row 4 cell 1</td><td style="border-top:10px solid #fff;">row 4 cell 2</td></tr> <tr><td>row 5 cell 1</td><td>row 5 cell 2</td><td>row 5 cell 3</td></tr> <tr><td>row 6 cell 1</td><td>row 6 cell 2</td><td>row 5 cell 3</td></tr> </table> если не критично еще можно использовать обертку внутри ячеек, и с ней много чего можно дополнительного реализовать в таблицах

тогда как выше предложили пустую строку <table> <tr><td>row 1 cell 1</td><td>row 1 cell 2</td><td rowspan=5>row 1 cell 3<br>must contain<br>several lines</td></tr> <tr><td>row 2 cell 1</td><td>row 2 cell 2</td></tr> <tr><td>row 3 cell 1</td><td>row 3 cell 2</td></tr> <tr><td colspan="2" style="padding-top:10px;"></td></tr> <tr><td>row 4 cell 1</td><td>row 4 cell 2</td></tr> <tr><td>row 5 cell 1</td><td>row 5 cell 2</td><td>row 5 cell 3</td></tr> <tr><td>row 6 cell 1</td><td>row 6 cell 2</td><td>row 5 cell 3</td></tr> </table> или если подсветка ячеек не обязательна, то можно так <table> <tr><td>row 1 cell 1</td><td>row 1 cell 2</td><td rowspan=4>row 1 cell 3<br>must contain<br>several lines</td></tr> <tr><td>row 2 cell 1</td><td>row 2 cell 2</td></tr> <tr><td>row 3 cell 1</td><td>row 3 cell 2</td></tr> <tr><td style="padding-top:10px;">row 4 cell 1</td><td style="padding-top:10px;">row 4 cell 2</td></tr> <tr><td>row 5 cell 1</td><td>row 5 cell 2</td><td>row 5 cell 3</td></tr> <tr><td>row 6 cell 1</td><td>row 6 cell 2</td><td>row 5 cell 3</td></tr> </table>

не понял что именно нужно реализовать, а если padding-top для td указать, то что нужно получается или нет?

думаю стоит их изучать параллельно

если у вас в форме есть <input type="hidden" id="scrtop" name="scrtop"> то можно document.getElementById("scrtop").value = window.pageYOffset;