I am making a react app and have installed the latest bootstrap via npm install bootstrap and npm install bootstrap jquery and npm install jquery popper.js My Navbar works fine when the window is wide, but when you decrease the…
I want my nav elements to be placed to the right of my webpage and it is. No problems there. My issue is that my nav elements are too close together. I expect them to be more spaced out. What…
I'm trying to do a single webpage. I have a problem that Bootstrap navbar collapse list appears under other elements. I tried to set the list position to relative and also the following elements position. Also changed opacity and put…
<div class="flex bg-black h-12 items-center space-x-11"> <nav class=""> <span> <a class="text-white text-3xl font-bold hover:text-gray-300 hover:underline" href="#" >Corner Hair Salon</a > </span> <span> <a class="text-white text-3xl hover:text-gray-300 hover:underline" href="#" >Home</a > <a class="text-white text-3xl hover:text-gray-300 hover:underline" href="#" >About</a > <a class="text-white…
When I trying to hover on PARK sub-nav should appear but its not and it should overlap on hero-slider .subnav ul { display: flex; gap: 20px; visibility: hidden; } .nav-hover:hover .subnav { visibility: visible; } <!-- Nav Bar --> <div…
The Issue I'm facing a problem with my WordPress website designed using Elementor and an Envato template. Divider lines are appearing between my headerand footersections, which makes my website look unattractive as my logo and navigation bar are positioned under…
right now Im working on the odin project trying to build a landing page. My navbar stays on the left side although I want it to be on the right side. This is my code: .container{ width:100%; height:27vh; background-color: #1f2937;…
How can i modify my app.js file to hide Navbar for signin and signup pages, but render for other pages? I want to render navbar once but screencomponents inside it should change. In navbar , I have to pass screenComponent…
const nav1=document.querySelector('.navbar'); window.addEventListener('scroll', function () { if(window.scrollY>70) { nav1.classList.add('new_nav'); } else if (window.scrollY < 69) { nav1.classList.remove('new_nav'); } } Im trying this code in React App.js file, if i scroll down it shows error like "nav1 is NULL".It worked when…
I want to have a very simple hamburger menu. I'm using jQuery to toggle it to open and close when the hamburger is clicked.hamburger menu open I implemented the following js code but I only get the menu to hide…