[Tip] Drop Down Menu Tutorial (..for all themes)

Started by Hoochie Coochie Man, August 05, 2008, 05:37:39 AM

Previous topic - Next topic

h3aD$h0t

Hi , i have DzinerStudio's SilentWave, i was edit it. If have codes for dropdown menu for silent wave, pls give them to me xD i cnat find them, sorry, my english is bad again xD

Weite13


Awwwwww Cute

NoFeaR / NFSMW

I have a big problem, i made a small dropdown menu and put it insite a TP block. But the dropdown menu goes under the other block. How can i fix that problem?

harrysgantzias

I had a similar problem, and i fixed it by doing this:

in style.css i changed the:
div#menu {
   float: left;
  ...


to:
float: none;

tell me if this helps you!  :)
Forum Alimentarius
Student Community of Food Science and Technology

NoFeaR / NFSMW


NoFeaR / NFSMW

Nope, This is what my css looks like this.
Quoteul#css3menu,ul#css3menu ul{
    margin:0;list-style:none;background-color:#C0C0C0;background-image:url("mainbk.png");background-repeat:repeat;border-width:0px;border-style:solid;border-color:#999999;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;}
ul#css3menu ul{
    display:none;position:absolute;left:0;top:100%;-moz-box-shadow:0.7px 0.7px 1px #777777;-webkit-box-shadow:0.7px 0.7px 1px #777777;box-shadow:0.7px 0.7px 1px #777777;padding:0 9px 9px;background-color:#FFF;background-image:none;border-width:1px;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;border-style:solid;border-color:#d8d9da;}
ul#css3menu li:hover>*{
    display:block;}
ul#css3menu li:hover{
    position:relative;}
ul#css3menu ul ul{
    position:absolute;left:100%;top:0;}
ul#css3menu{
    padding:1px 1px 1px 0;display:block;font-size:0;float:left;}
ul#css3menu li{
    display:block;white-space:nowrap;font-size:0;float:left;}
ul#css3menu>li,ul#css3menu li{
    margin:0 0 0 1px;}
ul#css3menu ul>li{
    margin:1px 0 0;}
ul#css3menu a:active, ul#css3menu a:focus{
    outline-style:none;}
ul#css3menu a{
    display:block;vertical-align:middle;text-align:left;text-decoration:none;font:bold 12px Arial,sans-serif;color:#262626;cursor:default;padding:10px;background-color:#C0C0C0;background-image:url("mainbk.png");background-repeat:repeat;background-position:0 200px;border-width:0px;border-style:none;border-color:;}
ul#css3menu ul li{
    float:none;margin:9px 0 0;}
ul#css3menu ul a{
    text-align:left;padding:8px 0 0 0;background-color:#FFF;background-image:none;border-width:1px 0 0 0;border-style:solid;border-color:#D9D9D9;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;font:13px Arial,sans-serif;color:#333333;text-decoration:none;}
ul#css3menu li:hover>a{
    background-color:#C0C0C0;border-style:none;font:bold 12px Arial,sans-serif;color:#efefef;text-decoration:none;background-image:url("mainbk.png");background-position:0 100px;}
ul#css3menu img{
    border:none;vertical-align:middle;margin-right:10px;}
ul#css3menu img.over{
    display:none;}
ul#css3menu li:hover > a img.def{
    display:none;}
ul#css3menu li:hover > a img.over{
    display:inline;}
ul#css3menu span{
    display:block;overflow:visible;background-position:right center;background-repeat:no-repeat;padding-right:0px;}
ul#css3menu ul span{
    background-image:url("arrowsub.gif");padding-right:27px;}
ul#css3menu ul li:hover>a{
    background-color:#FFF;background-image:none;border-style:solid;border-color:#D9D9D9;font:13px Arial,sans-serif;color:#55de3d;text-decoration:none;}
ul#css3menu li.topfirst>a{
    height:35px;line-height:35px;border-radius:4px 0 0 4px;-moz-border-radius:4px 0 0 4px;-webkit-border-radius:4px;-webkit-border-top-right-radius:0;-webkit-border-bottom-right-radius:0;text-shadow:#d8d8d8 0px 1px 1px;}
ul#css3menu li.topfirst:hover>a{
    line-height:35px;text-shadow:#3d3d3d 0px -1px 1px;}
ul#css3menu li.topmenu>a{
    height:35px;line-height:35px;text-shadow:#d8d8d8 0px 1px 1px;}
ul#css3menu li.topmenu:hover>a{
    line-height:35px;text-shadow:#3d3d3d 0px -1px 1px;}
ul#css3menu li.toplast>a{
    height:35px;line-height:35px;border-radius:0 4px 4px 0;-moz-border-radius:0 4px 4px 0;-webkit-border-radius:0;-webkit-border-top-right-radius:4px;-webkit-border-bottom-right-radius:4px;text-shadow:#d8d8d8 0px 1px 1px;}
ul#css3menu li.toplast:hover>a{
    line-height:35px;text-shadow:#3d3d3d 0px -1px 1px;}
ul#css3menu ._>li>a{
    padding:0;}
ul#css3menu li.subfirst>a{
    border-width:0;border-style:none;padding:0;}
ul#css3menu li.subfirst:hover>a{
    border-style:none;}

TheSniperK2R

Could i possibly get any help with this? I'm running SMF 2.0 RC3 and using the DarkBreak theme . I am sorry for asking but i do not have any coding experience and i don't feel comfortable with editing any files. But i do feel this would really help out my website a lot.
www.crazykillas.com

www.crazykillas.com

TheSniperK2R

www.crazykillas.com

www.crazykillas.com

TheSniperK2R

www.crazykillas.com

www.crazykillas.com

harrysgantzias

i personally dont know man... sorry
i m not a programmer and i dont have smf 2 rc3...
if i had... my pleasure to help...

any others here?

somebody inside the community may know...
Forum Alimentarius
Student Community of Food Science and Technology

TheSniperK2R

thanks tho, hopefully someone here could help since im a noob at this.. :(
www.crazykillas.com

www.crazykillas.com

TheSniperK2R

www.crazykillas.com

www.crazykillas.com

TheSniperK2R

www.crazykillas.com

www.crazykillas.com

Advertisement: