#javascript #css #reactjs #hyperlink #navbar
#язык JavaScript #CSS #реагирует на #гиперссылка #навигационная панель
Вопрос:
```import React from 'react' /*import { NavLink, NavMenu, NavBtn, NavBtnLink } from './NavbarElements';*/ import { NavLink as Link } from 'react-router-dom'; import styled from 'styled-components'```
Я добавил этот NavbarContainer, const NavbarContainer = () =gt; { const navLinkStyle = { I tried to do flex-flow inline css here flexFlow: 'column nowrap' }; return ( lt;divgt; lt;Nav style={navLinkStyle}gt;
потому что думал, что это поможет, но я все еще не могу получить нужный вид столбца на навигационной панели со стороны гамбургера, когда навигационная панель опускается и сдвигается вправо, Навигационная ссылка и NavMenu-это то, что, по моему мнению, меня смущает. Я сделал два разных урока, чтобы создать это, и именно это создает мне проблемы «` Маргарет C Рокита CPA MST
lt;NavLink to='/about' activeStylegt; About lt;/NavLinkgt; lt;NavLink to='/services' activeStylegt; Services lt;/NavLinkgt; lt;NavLink to='/contact-us' activeStylegt; Contact Us lt;/NavLinkgt; lt;NavLink to='/sign-up' activeStylegt; Sign Up lt;/NavLinkgt; lt;/NavMenugt; lt;NavBtngt; lt;NavBtnLink to='/signin'gt;Sign Inlt;/NavBtnLinkgt; lt;/NavBtngt; lt;/Navgt; lt;/divgt; ) } export default NavbarContainer export const Nav = styled.nav` background: red; height: 80px; display: flex; justify-content: space-between; padding: 0.5rem calc((100vw - 1000px) / 2); z-index: 10; color: #3451d2; @media (max-width: 768px) { /*position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 200px; height: 200px;*/ ``` Here I also tried to do flex-flow: column ```flex-flow: column nowrap; top: 0; right: 0; height: 100vh; width: 300px; padding-top: 0.5rem; padding-bottom: 32.5rem; width: 10px padding-top: 0rem; top: 00; right: 0; transform: translate(-100%, 75%); font-size: 0.88em; cursor: pointer; border-radius: 10px; transform-origin: 1px; transition: all 0.3s linear; position: fixed; height: 100vh; width: 10px display: block; padding-top: 3.5rem; top: 0; right: 0; transform: translate(-100%, 75%); font-size: 1.15em; cursor: pointer; background-color: ${({ open }) =gt; open ? 'teal' : 'green'}; border-radius: 10px; transform-origin: 1px; transition: all 0.3s linear;