@Quiab

Почему текст не сразу приклеивается к правому краю, а только после выполнения JS?

Здравствуйте!
С помощью Bootstap верстаю сайт
Думаю код интуитивно понятен, проблема в том, что при первом запуске Sign In | Sign Out прижимаются к кнопке, а после повторного открытия этого меню - прижимается к правому краю, как и должно быть изначально
<!-- HTML CODE -->
    <div class='my_login nav navbar-dark bg-dark'>
      <a class='my_close navbar-brand btn btn-second ml-2'>▽</a>
      <div class="mr-5" style="float:right;">
        <ul class="nav">
          <li class="nav-item">
            <a class="nav-link active" href="/login">Sign in</a>
          </li>
          <li><a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">|</a></li>
          <li class="nav-item">
            <a class="nav-link" href="/registration">Sign up</a>
          </li>
        </ul>
      </div>
    </div>

    <div class="my_blank navbar-light bg-light" style="display: none;">
      <a class='my_open navbar-brand btn btn-light ml-2'>▷</a>
    </div>


// JavaScript Code
const show_btn = document.querySelector('.my_open');
const close_btn = document.querySelector('.my_close')
const close_block = document.querySelector('.my_blank')
const log = document.querySelector('.my_login');

show_btn.addEventListener('click', () => {
    close_block.style.display = 'none'
    log.style.display = 'block'
})

close_btn.addEventListener('click', () => {
    log.style.display = 'none'
    close_block.style.display = 'block'
})
  • Вопрос задан
  • 68 просмотров
Решения вопроса 1
iiiBird
@iiiBird Куратор тега CSS
Пока ты спишь - твой конкурент совершенствуется
потому что navbar-light bg-light изначально display: flex
а ты ему задаешь display: block
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы