Блог

Главная - Вопросы по программированию - Как сделать SideNav согласованным во всех браузерах?

Как сделать SideNav согласованным во всех браузерах?

#css #sidenav

#css #sidenav

Вопрос:

Я попытался расположить SideNav в правой части браузера с помощью изменений css, и он работает локально в Chrome и FireFox. Однако, когда я размещаю его, SideNav не перемещается вправо, а вместо этого опускается вниз или исчезает. Это происходит и на Mac (Safari, Chrome, Firefox), а также на других компьютерах с Windows.

Чего мне здесь не хватает?

Мой CSS, чтобы установить его в нужное положение:

 .sidenav_Right {
  position: fixed;
  top: 0;
  bottom: 0;   
  left: 1302px;  
  z-index: 1006;
  float: right;
  min-width: 64px;
  background: #4a4a4a;
  -webkit-transition: min-width 0.2s;
  -moz-transition: min-width 0.2s;
  -o-transition: min-width 0.2s;
  -ms-transition: min-width 0.2s;
  transition: min-width 0.2s;
}

Это настройка ReactJS

 import SideNav, { NavItem, NavIcon, NavText } from '@trendmicro/react-sidenav';   import '@trendmicro/react-sidenav/dist/react-sidenav.css';  

<SideNav className="sidenav_Right fw-shadow bg-white py-0"> 
 <SideNav.Nav> 
  <NavItem eventKey="key1"> 
   <NavIcon> 
    <i className="fa fa-dot-circle-o"/>
   </NavIcon>
   <NavText>Key 1</NavText> 
  </NavItem> 
 </SideNav.Nav> 
</SideNav>

Комментарии:

1. Скриншоты, ссылка на вашу размещенную страницу или демонстрационный код были бы лучше, чтобы увидеть вашу проблему.

2. Вы можете отредактировать свой текущий вопрос и включить обновления в сам вопрос вместо написания комментариев.

Метки: