Vzhledem k tomu, že jsem teď narychlo v zálohách našel verzi z roku 2003, ve které byly některé položky škrtnuté, protože přestaly existovat, tak ten počátek musí být ještě mnohem starší a protože to funguje jak má, nebyl důvod to předělávat, jen doplňovat. HTML5 přišlo nejmíň o nějakých 10 let později a nebyl důvod to předělávat, když to správně pobraly i nové verze prohlížečů. Ono to správně pobere i letošní FF a patrně i všechny ostatní.

co se   týče, tak současné doporučení zní asi takto
https://www.w3schools.com/html/html_entities.asp

A commonly used entity in HTML is the non-breaking space:  

A non-breaking space is a space that will not break into a new line.

Two words separated by a non-breaking space will stick together (not break into a new line). This is handy when breaking the words might be disruptive.

Pokud toto tvrdí standard dodnes, tak nevidím důvod, proč to nepoužít, když potřebuju aby mi oddělovač | nepřepadnul na další řádek a byl spolehlivě odsazený jak od odkazu pře ním, tak za ním. Určitě to asi jde udělat nějakou krkolomnou konstrukcí v CSS, která by patrně v různých prohlížečích (od roku 2003 dodnes) fungovala místy nějak jinak, nebo dokonce nějakým nesmyslným javascriptovým frameworkem, který je úplně na nic, když je proto všeobecně používán znak tvrdé mezery, který dělá přesně to, co má. A tato idea tu byla běžně rozšířená už v 90-tých letech a je podporovaná pro tento účel dodnes.

Ale klidně se pochlub, jak bys ty zařídil, aby jednotlivé odkazy měly mezi sebou svislítko, od obou oddělené mezerou, které by nepřetékalo na další řádek, ale drželo se odkazu před sebou.

width a height by šlo nastavit v CSS, akorát to nefungovalo u všech prohlížečů stejně a pak bych tam musel stejně dopisovat třídy, protože taky nemám všechny ikonky v odkazech stejně velké (a mám pro to své důvody) a naopak ty obrázky z těch site taky lezou v různých velikostech. Námahy by mi to moc neušetřílo, protože to nepíšu celé pokaždé znovu, ale buď kopíruju a edituju řádek, pokud to tam cpu ručně, nebo prostě generuju, když to tam cpu nějakým z nástrojů

Co se layoutu týče, tak sis mohl všimnout, že to je logicky tabulka, protože to je nejjednodušší způsob, jak mít data organizovaná ve sloupcích a řádcích. Asi by se to dalo nějak nasimulovat přez nějaké divy a jiné zázraky, ale nevidím k tomu žádný rozumný důvod. Ale můžeš zkusit nějaký uvést, rád si ho přečtu.

----

Na druhou stranu, pokud by s tím někdo chtěl začít teď, tak si to může navrhnout jinak a moderněji, pokud se s tím bude chtít camrat. Důležitá je ta myšlenka, že odkazy na (převážně) webová stránky lze velice snadno skladovat ve formě webové stránky na lokálu.
A protože lidi jsou různí, tak pro ty líné (či neznalé) jsem sem hodil jednoduchou šablonu, kterou stačí rozkopírovat a narvat tam svoje odkazy.