Stalker_RED

Без костылей никак. Лучше пересмотреть свой подход и переверстать.
Элемент с position:absolute выпадает из потока (flow) и не занимает места в родителе.

Костыль: при помощи js получить width у абсолютного элемента и установить его в parent.

Процитирую ответ, который давал на вопрос Как хранят свои страницы крупные сайты?

>> Единая точка входа - один php файл, (обычно index.php лежащий в корне сайта), в который попадают все запросы ко всем страницам. Он запускает движок и вызывает router (маршрутизатор) - скрипт, который по url определяет какой раздел и какая страница запрошена. Ориентируясь на правила прописанные в маршрутизаторе он запускает нужный модуль (читайте про mvc). Там где-то происходят обращения в базу данных, какая-то бизнес-логика работает, и в итоге данные передаются в шаблонизатор, который выдает HTML код.

Чтобы самому не изобретать всё с нуля можно взять набор готовых компонентов. Такие наборы называются фреймворками.
Это все подходит не только для крупных сайтов, а для любых проектов, где больше одной страницы.

Для отслеживания изменений в DOM существует MutationObserver

var target = document.querySelector('#foo')

var observer = new MutationObserver(
  function(mutations) {
    mutations.forEach(function(mutation) {
      var size = 50 - target.textContent.length
      target.style.fontSize = size + 'px'
    });    
  }
);

observer.observe(target, { childList: true });

https://jsfiddle.net/6d869a3v/

Вы практически одновременно запускаете три таймера на одну секунду. секунда проходит и они практически одновременно срабатывают.
Можно поставить им разную задержку

setTimeout(Red, 1000);
setTimeout(Green, 2000);
setTimeout(Blue, 3000);

Или использовать setInterval, и показывать цвета по по очереди.

var i=0,
    timer = setInterval(()=>
        h1.style.color = ['red','green','blue'][i++] || clearInterval(timer)
    , 1000)

https://jsfiddle.net/m5qg1us9/

UPD: то-же самое, но в массиве функции:

var myFunctions = [Red, Green, Blue]

var i=0, timer = setInterval(()=>{
  if (i < myFunctions.length) myFunctions[i++]()
  else clearInterval(timer)
}, 1000)

https://jsfiddle.net/nk7gepjw/

Вариант с итератором: https://jsfiddle.net/zdcL58ho/

как можно отправить сразу две формы

Никак, только по очереди.

и для чего и как в header content-disposition можно задать несколько значений как выше в примере

Вот же https://developer.mozilla.org/ru/docs/Web/HTTP/Hea...

Возможно вы путаете понятие форма (form) и поле (field).

Вот пример отправки формы с файлами через XHR: https://developer.mozilla.org/ru/docs/Web/API/Form...
А JSON объект можно преобразовать в строку, и ее уже отправить.

На все ваши вопросы могут ответить только люди хорошо знакомые с вашей компанией.
Если вы главный или единственный дизайнер - меняйте брендбук под свою ответственность, утверждайте (если надо) и вперед. Если вы не главный - поговорите с главным.

var prevPos
$('body').on('mousedown', function (evt) {
    $(this).on('mousemove', drag)
    prevPos = {x:evt.clientX, y:evt.clientY}
}).on('mouseup mouseout', function() {
    $(this).off('mousemove', drag)
})

function drag(evt) {
    window.scrollBy(prevPos.x - evt.clientX, prevPos.y - evt.clientY) // вся магия здесь
    prevPos = {x:evt.clientX, y:evt.clientY}
}

https://jsfiddle.net/9ad1ohcx/

Вот же: https://www.postgresql.org/docs/9.1/static/auth-pg...
Поставьте reject для всех кроме local.

Добавить первому элементу class=active, например, и повесить обработчик кликов, который будет менять класс.

$('.menu span').on('click', function(){
  $(this).addClass('active')
  .siblings().removeClass('active')
})

https://jsfiddle.net/ung8o8j4/

Готовые решения:
https://select2.github.io/examples.html
https://harvesthq.github.io/chosen/

Или вам туториал написать как объединить несколько строк в одну?

var values  = []
$('.multiselect :checked').each(function(){
  values.push(this.value)
})
$( '#text_comment' ).html('Был выбран '+ values.join(' '))