Hlib

margin-top: 1px;
margin-left: 1px;
Нужно смотреть что с ними происходит при hover
Лучше вообще не использовать margin с флексами, по крайней мере тут, как альтернатива: border-left: 1px solid #fff; border-top: 1px solid #fff;

Это следствие разных алгоритмов обработки суб-пиксельных вычислений т.к. браузерам всё равно в конечном итоге приходится рисовать страницу на экране, состоящем из пикселей. В случае hi dpi экранов, где за один логический пиксель отвечает несколько физических задача решается проще, но для экранов с dppx=1 приходится делать выбор и вот этот выбор делается по-разному.

На больших контейнерах это незаметно, а для маленьких - да, есть шанс того что элемент будет выглядеть "криво". Какого-то универсального решения здесь, судя по всему, нет, остаётся только подгонять, добавляя отступы в 1px туда или сюда для разных браузеров. Для того чтобы добавить CSS код только для какого-то конкретного браузера можно воспользоваться, к примеру, информацией с browserhacks, хотя, конечно, тут надо быть осмотрительным.

.class_one.class_two {
    # без пробела между классами
}

.class0.class1 {}

Начните с изучения поиска. На Тостере уже отвечали про то, как учить вёрстку. На Тостере уже отвечали о том, какие шансы у верстальщика зарабатывать на фрилансе. И на Тостере уже отвечали о том, какие шансы зарабатывать на фрилансе, не имея за спиной хотя бы пары лет офисной работы.

Проверь наличие в head такой штуки

<meta name="viewport" content="width=device-width, initial-scale=1">.

param = !param

$(function(){
  $("#sel").change(function(){
    $("#BNBUSDT,#MANABTC,#MANAETH,#BNBBTC").css("display","none");
    $("#"+$(this).val()).css("display","block");
  });
});

P.S. Для любителей нативного js

window.onload = () =>{
  document.all.sel.onchange =(e) => {
    document.querySelectorAll("#BNBUSDT,#MANABTC,#MANAETH,#BNBBTC").forEach((e) =>{
    	e.style.display = "none";
    });
    document.querySelector("#"+e.srcElement.value).style.display = "block";
  };
}

100% перегрет, но не программистами или веб-мастерами, а индивидами, которые решили что веб это просто и легко и не стоит сильно париться над своими скиллами и знаниями.

function nameOfFunction () {
alert (2+3);
}

nameOfFanction(); // опечатка.

Вам редактор должен был предлагать автодополнением название Вашей функции (при попытке вызвать её), если бы Вы его использовали, то не было бы опечатки.
Так же рекомендую научиться пользоваться линтером. (ESLint)

function nameOfFunction

nameOfFanction();

Думаю, использовать tuple в этом случае корректнее.
type Option = [Date | null, Date | null];
Ну а дальше тип определяется просто как Option[]

да, можно

А просто на флексах и sticky-top? пример на бутстрапе 4

<div class="container">
  <div class="row">
    <div class="col-2">
      <p class="sticky-top">A</p>
    </div>
    <div class="col-10">
      <p>AA</p>
      ...
      <p>AZ</p>
    </div>
  </div>
  <div class="row">
    <div class="col-2 sticky-top">
      <p class="sticky-top">B</p>
    </div>
    <div class="col-10">
      <p>BA</p>
      ...
      <p>BZ</p>
    </div>
  </div>
  <div class="row">
    <div class="col-2 sticky-top">
      <p class="sticky-top">c</p>
    </div>
    <div class="col-10">
      <p>CA</p>
      ...
      <p>CZ</p>
    </div>
  </div>
</div>

Что-то мне подсказывает, что ответ вы найдёте вооот тут