ScrollDown Failed 2

[loserone+_+]

i have a normal scroll down in my html like this

 

 

 

but when i adding something to larging the menu it becomes like this

 

 

 

is that supposed to be happen ?

when i entering witdh into the css for navbar like that

 

here's my css code

<style type="text/css">nav ul, nav li { padding: 0;margin: 0;text-indent: 0;list-style-type:none;}nav ul {background: #009933;filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#009933,endColorstr=#bbbbbb);background: linear-gradient(top, #009933 0%, #bbbbbb 100%);background-image: -ms-linear-gradient(top, #009933 0%, #bbbbbb 100%);background: -moz-linear-gradient(top, #009933 0%, #bbbbbb 100%);background-image: -o-linear-gradient(top, #009933 0%, #bbbbbb 100%);background: -webkit-linear-gradient(top, #009933 0%, #bbbbbb 100%);box-shadow: 0px 0px 9px r gba(0,0,0,0,15);width: 1000px; /* This was causing the problem but i want to larging the range of menu */padding: 0;border-radius: 25px;list-style: none;display: inline-block;}nav ul:after {content: "";clear: both; display: block;}nav ul li {float: left;position: relative;   }nav ul li: hover {background: #66FF66;filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#47B247, endColorstr=#59BA59);background: linear-gradient(top, #47B247 0%, #59BA59 40%);background-image: -ms-linear-gradient(top, #47B247 0%, #59BA59 40%);background: -moz-linear-gradient(top, #47B247 0%, #59BA59 40%);backgorund-image: -o-linear-gradient(top, #47B247 0%, #59BA59 40%);background: -webkit-linear-gradient(top, #47B247 0%, #59BA59 40%);}nav ul li: hover a {color: #fff;}nav ul li a {display: block; padding: 25px 40px;color: #993300; text-decoration: none;}nav ul li:hover > ul{display: block;}nav ul ul {display: none;position: absolute;left: 0;top: 68px;background: #59BA59;border-radius: 0px;padding: 0;z-index: 9999;}nav ul ul li {float: none;border-top: 1px solid #A30000;border-bottom: 1px solid #3333FF;}nav ul ul li a {padding: 15px 40px;color: #fff;}nav ul ul li a:hover {background: #3333FF;}</style><!--[if IE]><style type="text/css">nav ul ul            {            top:66px;            }nav ul li:hover > ul            {            display: none;            }</style><![endif]--><!--[if gte IE 8]><style type="text/css">            nav ul li:hover            {                    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#47B247, endColorstr=#59BA59);                    }</style><![endif]-->

nah, what should i add or remove for larging the menu ?

[Ingolme]

1000px is really wide. If you tell it to be 1000px wide, it's going to be 1000px wide, which looks like the image you showed.

Try 200px or something like that.

 

I think I didn't understand what you want. Changing the selector might fix your problem. Maybe you just meant to alter the root menu (nav > ul) or only alter the submenus (nav li ul)

[loserone+_+]

 

width: 200px becoming like this,

i using width: 1000px to larging the menu horizontally,

 

my goal simply i want to larging the menu horizontally,

but the submenus dont larging like the nav menu did,

this is my goal,

 

please help me fix the problem. i didnt know how to larging the menu horizontally rather than width in this case, and unfortunately width cause problem to the submenus.

[Ingolme]

OK, you're trying to set the width of the top level but not the other levels. I addressed that in the second paragraph of my previous post. Change the selector you're using so that it will only access the top level:

 

nav > ul { width: 1000px; }

[loserone+_+]

it works

 

seems, the width i using before this changed the top nav until the bottom of nav selector,

i'll fix this carelessness on the future coding,

Problem Solved! Thanks a million sir