Даниил Попов

Вообще, если честно, то на ваш код больно смотреть. Он некрасивый, непонятный и его сложно отладить.
Я только учусь, но, мне кажется, следует писать так:

var boxResult = document.getElementById("elementID");
var wrapperBlock = document.createElement("div");
var notifyBlock = document.createElement("div");
var linkBlock = document.createElement("a");

switch(true){

  case (num_notify > count_items):
  
    notifyBlock.classList.add("ta-left");
    notifyBlock.setAttribute("style", "float: left");
    
    linkBlock.setAttribute("href", "javascript:void(0)");
    linkBlock.onclick(function(){
    	// если у вас нет единой функции-обработчика
    });
    linkBlock.innerText = "Назад";
    
    notifyBlock.appendChild(linkBlock);
    
  break;
  
  case(num_notify < count_notify[type_notify]):

    notifyBlock.classList.add("ta-right");
    notifyBlock.setAttribute("style", "float: right");
    
    linkBlock.setAttribute("href", "javascript:void(0)");
    linkBlock.onclick(function(){
    	// если у вас всё ещё нет единой функции-обработчика
    });
    linkBlock.innerText = "Дальше";
    
    notifyBlock.appendChild(linkBlock);

  break;
  	
  default:

    notifyBlock.setAttribute("style", "clear:both");
}

wrapperBlock.appendChild(notifyBlock);

boxResult.appendChild(wrapperBlock);

Конечно, знающие товарищи скажут, что и я пишу так себе, но мой код можно читать, не утонув в ковычках.
И не используйте инлайн стили. У вас там классы для этого прописаны.

В вашем случае
p + ul {
margin-top: -1em;
}

div{
  box-sizing:border-box; /* вот это добавить */
}

#main{
 width:100%;
 } 
 
#uk{		
        width:20%;
        height:50%;
        border:1px solid black;
        float:left;
}  

#content{
  	width:60%;
        height:100%;
        border:1px solid black;
        float:left; /* вот это исправить */
}

#ru{		
        width:20%;
        height:50%;
        border:1px solid black;
        float:right;
}

И уберите свойства height. Они не работают в данном контексте.

У меня два варианта ответа на ваш вопрос:
1. Если вам нужны тривиальные названия, то тут нейронные сети не при чем. Используйте сервисы типа
https://ultragenerator.com/company-name/
2. Если вам нужны оригинальные, броские и вообще крутые названия. То тут, боюсь, реализация на нейронных сетях буде чрезмерно трудоемкой и не факт, что даст результат лучше чем в п.1.

Любые, только они будут топорными и иногда не рабочими

Напомню, что 4 ещё в бете, поэтому для продакшена стоит остановиться на 3. В личных проектах, наверное, лучше 4ка.

Это вы position: sticky изобретаете?
Как сделать? Наверное, спецификацию почитать
https://developer.mozilla.org/ru/docs/Web/CSS/position

У вас pagespeed 0 для ПК и 2 для Мобилок (из 100 возможных). Стоит задуматься об оптимизации.
Поставьте плагин для чистки БД. Ну и хостинг порезвее что ли.
Но начинать с оптимизации

Работать скрипт будет из любого места.
Можно завернуть код в тег script и вставить именно туда куда нужно, если, конечно, код небольшой.
Можно подключить внешним файлом. Заверните код в функцию и уже на странице вызывайте функцию.

В том варианте, что вы описали, использовать function.php нет никакого смысла. Если уточните, что вы хотите сделать, можно будет посоветовать что-то более конкретное

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

Вот вам как вариант.
https://codepen.io/groog/pen/oGdaJO
Я, конечно, только учусь верстке и уверен, что можно сделать точнее и аккуратнее, но думаю вам важна принципиальная возможность.

Второй раздел - это, похоже, то, что вы ищете
https://developer.mozilla.org/en-US/docs/Web/Guide...

Я хоть и не опытный верстальщик, но полагаю, что на его месте я бы не искал себе лишней работы. Если не стоит прямой задачи сделать их html+css, то вполне приемлемо сделать в виде картинки (раст или svg) + текст поверх, а главное быстро, просто и понятно. В общем, целесообразность данного действия вызывает вопросы