The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

dropdown menu problem

4 posters

The forum of the forums :: Support forum :: Scripts (Coding) Problems :: Scripts Problems Archives

Go down

Solved dropdown menu problem

Post by xiaomah01 December 15th 2011, 1:01 pm

my dropdown menu before loading complete,will display not parallel

like this:
dropdown menu problem 3qxbI

after loading complete is ok.
like this:
dropdown menu problem L6BL0


i want to ask how can set tie
log in direct show menu like picture 2 ?

my css:
Code:
<head>
<style type="text/css">
/* common styling */
.menu {position:relative; margin:0; font-size:15px; margin:30px 0;display:}
.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000000;width:102px; height:20px; text-align:center; color:#000000; border:1px solid #000000; background:#CEE9F0; line-height:20px; font-size:14px; overflow:hidden; border-radius:2px;}
.menu ul {padding:0; margin:0;list-style-type: none; }
.menu ul li {float:left; margin-right:1px; position:relative;}
.menu ul li ul {display: none;}
/* specific to non IE browsers */
.menu ul li:hover a {color:#fff; background:#36f;}
.menu ul li:hover ul {display:block; position:absolute; top:21px; left:0; width:105px;}
.menu ul li:hover ul li a.hide {background:#CEE9F0; color:#000;}
.menu ul li:hover ul li:hover a.hide {background:#6fc; color:#000;}
.menu ul li:hover ul li ul {display: none;}
.menu ul li:hover ul li a {display:block; background:#ddd; color:#000;}
.menu ul li:hover ul li a:hover {background:#6fc; color:#000;}
.menu ul li:hover ul li:hover ul {display:block; position:absolute; left:105px; top:0;}
.menu ul li:hover ul li:hover ul.left {left:-105px;}
  </style>
<!--[if lte IE 6]>
<style type="text/css">
.menu ul li a.hide, .menu ul li a:visited.hide {display:none;}
.menu ul li a:hover ul li a.hide {display:none;}
.menu ul li a:hover {color:#fff; background:#36f;}
.menu ul li a:hover ul {display:block; position:absolute; top:21px; left:0; width:105px;}
.menu ul li a:hover ul li a.sub {background:#6a3; color:#fff;}
.menu ul li a:hover ul li a {display:block; background:#ddd; color:#000;}
.menu ul li a:hover ul li a ul {visibility:hidden;}
.menu ul li a:hover ul li a:hover {background:#6fc; color:#000;}
.menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:105px; top:0; color:#000;}
.menu ul li a:hover ul li a:hover ul.left {left:-105px;}
  </style>
<![endif]-->
</head>


Last edited by xiaomah01 on December 15th 2011, 7:43 pm; edited 1 time in total
xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: dropdown menu problem

Post by Guest December 15th 2011, 2:10 pm

What do you mean by "before loading complete"? Which loading? Smile
avatar
Guest
Guest


Back to top Go down

Solved Re: dropdown menu problem

Post by xiaomah01 December 15th 2011, 3:22 pm

Gassy wrote:What do you mean by "before loading complete"? Which loading? Smile


"loading" i can't find anyway to explain... scratch

just like this:
dropdown menu problem LtuEN



my problem appears in loading mode~
menu bal is no fix...

then loading is complete,the bal will be fix,ok

or u can go my site see,u will understand
can refresh to see problem(menu bal)
xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: dropdown menu problem

Post by Guest December 15th 2011, 3:29 pm

Try to add in your CSS Stylesheet:
Code:
div.menu, div.menu ul, div.menu ul li{
display: inline !important;
}
avatar
Guest
Guest


Back to top Go down

Solved Re: dropdown menu problem

Post by xiaomah01 December 15th 2011, 3:35 pm

Gassy wrote:Try to add in your CSS Stylesheet:
Code:
div.menu, div.menu ul, div.menu ul li{
display: inline !important;
}

become like this:
dropdown menu problem WpNsi

ps:they have many sub menu
xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: dropdown menu problem

Post by Guest December 15th 2011, 3:36 pm

Okay. Delete that and add this:
Code:
div.menu, div.menu ul{
display: inline !important;
}
or:
Code:
div.menu{
display: inline !important;
}
avatar
Guest
Guest


Back to top Go down

Solved Re: dropdown menu problem

Post by xiaomah01 December 15th 2011, 3:45 pm

Okay. Delete that and add this:
Code:
div.menu, div.menu ul{
display: inline !important;
}
this is same problem
Spoiler:





or:
Code:
div.menu{
display: inline !important;
}
this nothing to display... scratch

xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: dropdown menu problem

Post by blindbat1457 December 15th 2011, 5:43 pm

Well the only way to solve the problem is to make less buttons or make them smaller.

The problem you are having is your buttons width's exceed that of which the page with is, also take into account padding/borders.

You can either go and make your buttons smaller by changing the width's/padding or getting rid of some. An alternative method is combining the similar ones into a drop down navbar.
blindbat1457
blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

Solved Re: dropdown menu problem

Post by Nera. December 15th 2011, 5:56 pm

Code:
.menu ul li a, .menu ul li a:visited {
    width: 70px !important;
}

dropdown menu problem CZXu
Nera.
Nera.
Energetic

Female Posts : 7078
Reputation : 2017
Language : English
Location : -

Back to top Go down

Solved Re: dropdown menu problem

Post by xiaomah01 December 15th 2011, 7:38 pm

Nera. wrote:
Code:
.menu ul li a, .menu ul li a:visited {
    width: 70px !important;
}

i adjust width: 102px
it's is same problem~
before loading complete,will display not parallel
Spoiler:

after loading complete is ok
Spoiler:

scratch

nevermind i find another way to solved it

thanks nera~

xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: dropdown menu problem

Post by xiaomah01 December 15th 2011, 7:42 pm

blindbat1457 wrote:Well the only way to solve the problem is to make less buttons or make them smaller.

The problem you are having is your buttons width's exceed that of which the page with is, also take into account padding/borders.

You can either go and make your buttons smaller by changing the width's/padding or getting rid of some. An alternative method is combining the similar ones into a drop down navbar.

ok thanks~maybe i will make less button to solved it~thanks for suggestion Hello
xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: dropdown menu problem

Post by blindbat1457 December 15th 2011, 8:05 pm

No worries. There are plenty of ways to fix long navigation Smile
blindbat1457
blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

Solved Re: dropdown menu problem

Post by Sanket December 16th 2011, 6:02 am

Topic Solved & Locked
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Back to top

- Similar topics

The forum of the forums :: Support forum :: Scripts (Coding) Problems :: Scripts Problems Archives

 
Permissions in this forum:
You cannot reply to topics in this forum