@yosseix
Только только начинаю изучать программирование.

Почему не работает размытие фона в Mozilla FireFox?

Я использую фреймворк Tailwind CSS для написания стилей. Все работает в хроме и опера но в ФайрФокс не работает.
Не взаимодействуется этот код отвечающий за размытость и яркость:
<div class="backdrop-blur-sm backdrop-brightness-50 h-full">

А вот весь код
<body class="font-sans antialiased">
      <div class="basis-full bg-fixed bg-cover bg-no-repeat h-screen " style="background-image: url(https://images.pexels.com/photos/270348/pexels-photo-270348.jpeg?auto=compress&amp;cs=tinysrgb&amp;dpr=2&amp;h=750&amp;w=1260)">

                            <div class="backdrop-blur-sm backdrop-brightness-50 h-full">
            <div class="flex justify-between mx-4 p-2.5">
                   <!-- Вся навигационная панель -->
                  <div class="">
                               <!-- Логотип Синергии -->
                               <div title="Университет Синергия" class="shadow-xl hover:shadow-red-500/40 mx-2 hover:scale-110 ease-in duration-200">
                                   <a href="https://synergy.ru/">
                                       <img src="https://static.tildacdn.com/tild3133-3439-4261-b531-333236653930/Runa.svg" alt="syunergy_logo" class="w-14 h-14 p-1.5 bg-white rounded-md">

                                   </a>

                               </div>
                 </div>
                 <!-- Имя, Войти-Выйти -->
                 <form class="my-auto" method="POST" action="http://synergy-project/logout">
                      <input type="hidden" name="_token" value="z9GdchbXSU5mJca00ENrd7gAN3JQ7VCaJ2u66ZTu">                          <span title="Ваше имя" class="border border-transparent rounded-md bg-white py-2 px-3 text-sm font-medium text-gray-700 uppercase">Alan Wayne</span>
                          <a class="hover:scale-110 shadow-xl hover:shadow-blue-500/80 inline-flex items-center px-3 mr-4 py-1.5 bg-blue-700 border border-transparent rounded-md font-semibold text-sm text-white uppercase tracking-widest hover:bg-white hover:text-blue-700 active:bg-gray-900 focus:outline-none focus:border-gray-900 focus:ring ring-gray-300 disabled:opacity-25 transition ease-in-out duration-150 ml-4" href="route('logout')" onclick="event.preventDefault();
                         this.closest('form').submit();">
                         Выйти
                         </a>
                 </form>
           </div>

           <div class="flex justify-center flex-wrap">
                    <div class="w-96">

                             <!-- Информация -->


                                      <div class="bg-white px-3 py-3 mt-32 shadow-2xl shadow-blue-500/50 rounded-lg opacity-90 border-4 border-blue-700 break-all h-fit">
                                                                        <!-- Голова -->
                                                                        <div class="flex justify-between">
                                                                                 <label class="text-lg font-semibold"> Данные пользователя </label>
                                                                                <a href="http://synergy-project/edit" class=" border rounded-md py-0.5 px-1 text-gray-400 hover:bg-neutral-400 hover:text-white ">Редактировать</a>
                                                                        </div>

                                                                         <!-- Вся информация-->
                                                                        <div class="mt-3">
                                                                                 <!-- имя и фамилия-->
                                                                                 <div class="flex flex-row flex-wrap ">

                                                                                          <div class=" mx-2 mb-6">
                                                                                                  <!-- имя-->
                                                                                                  <label class="text-sm ">Имя</label><br>
                                                                                                  <span class="text-lg border-gray-400 border-b-2">Alan</span><br>
                                                                                         </div>

                                                                                         <div class=" mx-2 mb-6">
                                                                                                  <!-- фамилия-->
                                                                                                  <label class="text-sm ">Фамилия</label><br>
                                                                                                  <span class="text-lg border-gray-400 border-b-2">Wayne</span><br>
                                                                                         </div>
                                                                                </div>

                                                                                <!-- почта -->
                                                                                <div class="mx-2 mb-6">
                                                                                         <label class="text-sm ">Email</label><br>
                                                                                         <span class="text-lg border-gray-400 border-b-2">talkingtom32203@mail.ru</span><br>
                                                                                </div>
                                                                                <!-- номер-->
                                                                                <div class="mx-2 my-6">
                                                                                         <label class="text-sm ">Ваш номер</label><br>
                                                                                         <span class="text-lg border-gray-400 border-b-2">+996707012055</span><br>
                                                                                </div>
                                                                                <!-- о себе -->
                                                                                <div class="mx-2 mb-4 mt-6">
                                                                                         <label class="text-sm">О себе</label><br>
                                                                                        <p class="text-lg border-gray-400 border-b-2">Hello, my name is Alan, im living in Turcey</p>
                                                                                </div>

                                                                        </div>
                                      </div>



                           <!-- Ссылки -->
                           <div class="mt-5 w-96">
                                    <div class="flex justify-between border-4 shadow-2xl shadow-blue-500/50 opacity-90 border-blue-700 p-1.5 bg-white rounded-md h-fit">

                                                                  <!-- Инста -->
                                                                  <a target="_blank" class="my-2.5 rounded-full shadow-xl hover:shadow-rose-500/40 mx-5 hover:scale-110 ease-in duration-200" title="Instagram" href="https://www.instagram.com/synergyuniversity/"><img src="https://www.svgrepo.com/show/331440/instagram.svg" alt="Instagram" width="45" height="45"></a>
                                                                  <!-- ВК -->
                                                                  <a target="_blank" class="my-2.5 rounded-full shadow-xl hover:shadow-blue-800/40 mx-5 hover:scale-110 ease-in duration-200" title="VK" href="http://vk.com/synergyuniversity"><img src="https://www.svgrepo.com/show/331634/vk-v2.svg" alt="VK" width="45" height="45"></a>
                                                                  <!-- ют -->
                                                                  <a target="_blank" class="my-2.5 rounded-full shadow-xl hover:shadow-red-500/40 mx-5 hover:scale-110 ease-in duration-200" title="Youtube" href="https://www.youtube.com/user/synergytvru"><img src="https://www.svgrepo.com/show/95009/youtube.svg" alt="Youtube" width="45" height="45"></a>
                                                                  <!-- ТГ -->
                                                                  <a target="_blank" class="my-2.5 rounded-full shadow-xl hover:shadow-sky-500/40 mx-5 hover:scale-110 ease-in duration-200" title="Telegram" href="https://t.me/synergyunivers"><img src="https://www.svgrepo.com/show/354443/telegram.svg" alt="Telegram" width="45" height="45"></a>

                                    </div>
                           </div>
                    </div>
           </div>
</div>

        
      </div>
    

</body>
  • Вопрос задан
  • 67 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

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