Я конечно новичок на форуме, но не по жизни ))
именно так и копировал и именно так с пробелами и переносом строк копируется (

notricky,
:blink: А что - поправить пробелы тяжело и есть ли смысл править - коли код рабочий ?

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

Адаптировал к своему виду. Вроде работает.
Единственное на чем я заморочился - так это на margin-left:-XXpx;

Надо было как то хитро подгадать границу-слева, для формы - что бы она появлялась в месте где висит ярлык. А для ярлыка подгадать границу-слева - чтобы небыло сдвигов. Жескотека какая-то. А какая между ними зависимость, нельзя ли это как то вычислять формульно?

Это при условии что у ярлыка и формы один и тот же размер и left не 50%, а 30 или 40%. Причем совсем беда начинается, когда изменяются размеры окна. Ярлык оказывается в одном месте, а всплывает форма в другом.

А все, разобрался. Вернулся к своему первоначальному варианту выкинув яваскрипт на клике + добавив абсолют + процентовку для left + transition по свойству top и + toggle Active.

Спасибо большое.

-XXpx - Это половина ширины элемента

Впоследствии я это понял, но все равно в вашем методе, если выбирать не 50% и не ровную ширину типа 500рх, то возникают большие сложности с позиционированием ярлыка и формы друг относительно друга. и всплытием в другом месте.