Вариант 2 - блок "Welcome... director" обернуть в див и "Start" тоже в див.
А их уже позиционировать через flexbox. https://jsfiddle.net/webirus/zkaemfb7/
Я бы выбрал второй вариант, хотя и абсолют тут будет уместен.
Быстренько ставь babel и пиши код по новой спецификации.
В ней появился новый тип строк - шаблонные строки element.innerHtml = `Мое имя ${myName}`;
Внутри можно сколько укодно ставить пробелов, табов. Можно прямо внутри записывать переменные (${variable}).
можете на локальном сервере настроить сразу правильный домен, и подпатчить свой hosts файл, чтобы браузер думал что все по-честному.
А при переносе главное чтобы не возникло несовместимостей с php и sql версиями и кодировками
Верстать полноценно не стоит, да и вообще это тупо как-то.. возьмут верстку и потом скажут что не подошел.
В бутстрапе и так 12 колонок по дефолту. Верстать лучше на бустрапе или фоундейшн, или еще на чем-то.. на чистом css с нуля очень долго и прошлый век.
Еще используй scss для ускорения.