How I stop Navigation Menu scrolling with screen?

[User]

prntscr.com/ex8w7z

I don't know very much coding, so can you help me?

My navigation menu code:

/* Navigation Menu */

@nav_bar_background: #2b333a left center repeat-x scroll;

@nav_bar_border: 0px solid @container_outer_border_color;

@nav_bar_border_radius: 0 0 5px 5px;

@nav_bar_button_color: #ffffff;

@nav_bar_button_font: 1em "Trebuchet MS", Verdana, Arial;

@nav_bar_button_decoration: none;

@nav_bar_button_shadow: none;

@nav_bar_button_background: #2b333a   scroll;

@nav_bar_button_hover_color: @nav_bar_button_color;

@nav_bar_button_hover_font: @nav_bar_button_font;

@nav_bar_button_hover_decoration: @nav_bar_button_decoration;

@nav_bar_button_hover_shadow: @nav_bar_button_shadow;

@nav_bar_button_hover_background: #007eff   scroll;

@nav_bar_button_current_color: #ffffff;

@nav_bar_button_current_font: @nav_bar_button_font;

@nav_bar_button_current_decoration: @nav_bar_button_decoration;

@nav_bar_button_current_shadow: @nav_bar_button_shadow;

@nav_bar_button_current_background: #f44336 center repeat-x scroll;

@nav_bar_bubble_text_color: #5a5a5a;

@nav_bar_bubble_font: .8em "Trebuchet MS", Verdana, Arial;

@nav_bar_bubble_background: #FFFFFF;

@nav_bar_bubble_border_radius: 5px;

#navigation-menu { padding: 0 8px; background: @nav_bar_background; border: @nav_bar_border; .rounded-corners(@nav_bar_border_radius); width: 90%;margin: 0 auto;}

#navigation-menu a { position: relative; }

#navigation-menu > ul, #navigation-menu > ul li { float: left; }

#navigation-menu > ul li a { min-width: 80px; display: inline-block; padding: 0 .75em; color: @nav_bar_button_color; font: normal 400 13px Open Sans; text-decoration: @nav_bar_button_decoration; text-shadow: @nav_bar_button_shadow; background: @nav_bar_button_background; line-height: 31px !important; -moz-transition: .2s;-webkit-transition: .2s;transition: .2s;border-bottom: 2px solid rgba(255, 255, 255, 0.0);}

#navigation-menu > ul li:hover a { color: @nav_bar_button_hover_color !important; font: normal 400 13px Open Sans; text-decoration: @nav_bar_button_hover_decoration !important; text-shadow: @nav_bar_button_hover_shadow; background: @nav_bar_button_hover_background; line-height: 31px !important; -moz-transition: .2s;-webkit-transition: .2s;transition: .2s;border-bottom: 2px solid rgba(255, 255, 255, 0.3);}

#navigation-menu > ul li a.state-active { color: @nav_bar_button_current_color !important; font: normal 400 13px Open Sans; text-decoration: @nav_bar_button_current_decoration !important; text-shadow: @nav_bar_button_current_shadow; background: @nav_bar_button_current_background; line-height: 31px !important; border-bottom: 2px solid rgba(255, 255, 255, 0.9);}

#navigation-menu > ul li a.state-active:hover { color: @nav_bar_button_current_color !important; font: normal 400 13px Open Sans; text-decoration: @nav_bar_button_current_decoration !important; text-shadow: @nav_bar_button_current_shadow; background: @nav_bar_button_current_background; line-height: 31px !important; border-bottom: 2px solid #ffffff;}

#navigation-menu div.tip-holder { position: fixed; top: -8px; right: 3px; display: inline-block; }

#navigation-menu div.tip-holder div.tip-number { padding: 3px 7px 2px 7px;background-color: #ffffff;border-radius: 0px;-moz-border-radius: 0px;-webkit-border-radius: 0px;font: 0.8em "Trebuchet MS",Verdana,Arial;line-height: .8em;text-shadow: none;box-shadow: 0px 0px 0px #333333;-moz-box-shadow: 0px 0px 0px #333333;-webkit-box-shadow: 0px 0px 0px #333333;height: .8em;color: #0066ff;}

#navigation-menu div.tip-holder span.tip { border-top: 4px solid @nav_bar_bubble_background; border-left: 4px solid transparent; border-right: 4px solid transparent; position: absolute; left: 6px; }



[Tumbleweed]

User,

What you indicated in your screen cap is the action bar and the code you posted is your menu bar. By default, the action bar will scroll until it hits the top of your screen and then go into a fixed position.  So is it really your menu bar (Home, Search, Members, etc..) or the action bar you don't want to scroll.

[Brian]

On line 1608 of Themes > Advanced Styles & CSS > Style Sheet on that theme remove the top property and the bar will properly align to the top of the screen when you scroll down instead of being almost 100 pixels past the top of the window.

[User]

Apr 17, 2017 7:56:56 GMT -8 Brian said:

On line 1608 of Themes > Advanced Styles & CSS > Style Sheet on that theme remove the top property and the bar will properly align to the top of the screen when you scroll down instead of being almost 100 pixels past the top of the window.

Where is the "top"?

[Brian]

Assuming I got the correct forum (since you didn't provide a link to the forum it was taking place on) you would remove just the section I colored red below:

.container>.control-bar {top: 93px !important;z-index: 55 !important; background-color:#f5f5f5;border-bottom: 1px solid #ddd;}

[User]

Apr 17, 2017 15:15:15 GMT -8 Brian said:

Assuming I got the correct forum (since you didn't provide a link to the forum it was taking place on) you would remove just the section I colored red below:

.container>.control-bar {top: 93px !important;z-index: 55 !important; background-color:#f5f5f5;border-bottom: 1px solid #ddd;}

Not worked ;-;

My forum is kogamaforumbr.boards.net/

[Lynx]

Inspecting the element, either:

(1) You didn't remove the part in red, that Brian pointed out, from line 1608 in your stylesheet; or
(2) There's another instance of this somewhere; or
(3) You were editing the wrong theme when you made the change.

This is what I see on the default theme:




Notice the red box I made on the lower right. It's showing that the top: 93px !important; styling is still there.

If I turn that styling off, you can see that the pagination bar sits at the top: