How To Create a Fixed Top Menu

Step 1) Add HTML:

Example

<div class="main">
<p>Some text some text some text some text..</p></div>

Step 2) Add CSS:

To create a fixed top menu, use position:fixed and top:0. Note that the fixed menu will overlay your other content. To fix this, add a margin-top (to the content) that is equal or larger than the height of your menu.

Example

/* The navigation bar */.navbar { overflow: hidden;
background-color: #333;position: fixed; /* Set
the navbar to fixed position */top: 0;
/* Position the navbar at the top of the page */width:
100%; /* Full width */}

Web Certificates

W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading and basic understanding.
Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content.
While using this site, you agree to have read and accepted our terms of use,
cookie and privacy policy.
Copyright 1999-2019 by Refsnes Data. All Rights Reserved.Powered by W3.CSS.