Hello. I do not know whether to post links to third-party resources here, but still. There is a site katvin.com, on this site there is a menu block which is always at the top when scrolling the page. I would like to make exactly the same block on css, but only that it would be constantly below (under the content).

  • Streletz, Max Zhukov Yes, thank you, the codes provided by you really work on ordinary sites. But I wanted to apply this action for the mozilla browser address bar. Those. With the help of the add-on, place the panel with the address bar at the bottom of the browser, unfortunately this method does not work in Mozilla. If there are solutions to this, post the code here. Thanks you. - skillful

3 answers 3

http://htmlbook.ru/css/position

Fixed - By its action, this value is close to absolute, but unlike it, it binds to the left, top, right, and bottom points specified by the properties on the screen and does not change its position when scrolling a web page. The Firefox browser does not display the scroll bars at all if the position of the element is fixed and it does not fit entirely into the browser window. In Opera browser, although scroll bars are shown, they do not affect the position of the element in any way.

    If you look at the styles of this site, we see that the block

    <div class="navbar navbar-fixed-top"> ... <div>

    which contains the menu has css top: 0 . When you change top: 0 to bottom: 0 you get the desired effect.

    In general, the problem is solved using

     #selector { position: fixed; bottom: 0; }

      For this you need to set the position: fixed value in the CSS div 'a and press it to the bottom. And, so that a div by analogy with the above example, stretches to its full width, you can set the width: 100% .

      CSS:

       .bottomMenu{ position:fixed; bottom:0; width:100%; }

      HTML:

       <div class="bottomMenu"> . . . </div>