Search code examples
cssflexboxnavbar

Change relative to absolute via media query

Is it possible to have a page that opens with 6 box items as nav menu, but when one is clicked to go to that area on the page, the nav becomes a standard fixed nav bar at the top of the page? Using only CSS (no JS).

  • I am a VERY junior coder.

I have been unable to find this to be possible thus far.

Solution

  • you can use id and callback(#) that id as a link

    <div class="navbar"> 
    <ul><a href="#page1"> page 1 </a></ul>
    <ul><a href="#page3"> page 3 </a> </ul> 
</div>
<h2 id="page1">this is page 1</h2>
<h2 id="page3">this is page 3</h2>