Pretražuju se:

MonoX support board

Start the conversation, ask questions and share tips and solutions with fellow developers.

Non-registered users can only browse through our support boards. Please register now if you want to post your questions. It takes a second and it is completely free. Alternatively, you can log in without registration using your credentials at major sites such as Google, Microsoft Live, OpenId, Facebook, LinkedIn or Yahoo.
Vrati se nazad na sve teme

Dropdown menu location  (Mono Support )

30488 put(a) pogledan, 6 odgovor(a) 30.11.2012. 11:38:25,  Kreirao(la) Zoomicon
Zoomicon

Zoomicon

30.11.2012. 11:38:25
when one uses nested pages it seems the drop-down menu shown uses a hardcoded vertical offset from the CSS. This doesn't take in mind the admin bar that is showing for admins/moderators so the dropdown menu shows higher, obscuring the menubar
</br>
</br>this isn't a problem if the parent item on the menubar is a dummy container (made at Pages tree in admin UI using Add container page), but if you've nested other pages under a page you want to be also able to click that parent page (but you can't since the popup menu shows above that toplevel menu item it when the admin bar is at the top)
</br>
</br>obviously the menu script should add some extra offset given to it via some global variable or something by the serverside to take in mind not only the admin bar but anyother content that may show at the top (like page L&F [look and feel] configuration / webparts selection-properties etc. UI)
Ovaj sadržaj još nije ocijenjen. 
2793 Reputacija 345 Ukupno objava
ivanb

ivanb

4.12.2012. 13:56:41
Zoomicon, can you please attach screenshot?
Ovaj sadržaj još nije ocijenjen. 
459 Reputacija 55 Ukupno objava
Zoomicon

Zoomicon

4.12.2012. 15:38:48
Our site's theme (see screenshot) currently uses the following CSS, was made based on the demo site
</br>
</br>
</br>
</br>(seems the issue is at "navigation" CSS class with the hardcoded "top" there)
</br>
</br>
</br> [btw a IE10RC/Win7 bug that made my CSS snippet below unreadable seems to be that when you upload attachments to a post it adds one blank row after every row in the post text]
</br>
</br>
</br>
</br>
</br> .navigation ul ul
</br>
</br>
</br>
</br> {
</br>
</br>
</br>
</br> position: absolute;
</br>
</br>
</br>
</br> z-index: 5000;
</br>
</br>
</br>
</br> top: 150px;
</br>
</br>
</br>
</br> float: left;
</br>
</br>
</br>
</br> clear: both;
</br>
</br>
</br>
</br> }
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br> and colors / paddings: .navigation .level0 li
</br>
</br>
</br>
</br> {
</br>
</br>
</br>
</br> display: block;
</br>
</br>
</br>
</br> float: left;
</br>
</br>
</br>
</br> clear:both;
</br>
</br>
</br>
</br> margin: 0px 0px 0px -10px !important;
</br>
</br>
</br>
</br> overflow: hidden;
</br>
</br>
</br>
</br> border-right: solid 1px Transparent;
</br>
</br>
</br>
</br> border-top: solid 1px Transparent;
</br>
</br>
</br>
</br> }
</br>
</br>
</br>
</br> .navigation .level0 li a
</br>
</br>
</br>
</br> {
</br>
</br>
</br>
</br> background: #27140e !important;
</br>
</br>
</br>
</br> text-decoration:none;
</br>
</br>
</br>
</br> color: #fff;
</br>
</br>
</br>
</br> display:block;
</br>
</br>
</br>
</br> padding: 0px !important;
</br>
</br>
</br>
</br> margin: 0px 6px 0px 0px !important;
</br>
</br>
</br>
</br> text-align: left;
</br>
</br>
</br>
</br> font-family: Verdana, Arial, Helvetica, sans-serif;
</br>
</br>
</br>
</br> font-size: 11px;
</br>
</br>
</br>
</br> height: auto !important;
</br>
</br>
</br>
</br> }
</br>
</br>
</br>
</br> .navigation .level0 li a.selected,
</br>
</br>
</br>
</br> .navigation .level0 li a:hover
</br>
</br>
</br>
</br> {
</br>
</br>
</br>
</br> background: #b0b535 !important;
</br>
</br>
</br>
</br> padding: 0px !important;
</br>
</br>
</br>
</br> margin: 0px 6px 0px 0px !important;
</br>
</br>
</br>
</br> } .navigation .level0 li a span
</br>
</br>
</br>
</br> {
</br>
</br>
</br>
</br> background: #27140e no-repeat top right !important;
</br>
</br>
</br>
</br> margin: 0 -10px 0 10px !important;
</br>
</br>
</br>
</br> padding: 4px 0px 0px 0px !important;
</br>
</br>
</br>
</br> height: 18px !important;
</br>
</br>
</br>
</br> width:140px;
</br>
</br>
</br>
</br> color: #fff;
</br>
</br>
</br>
</br> }
</br>
</br>
</br>
</br> .navigation .level0 li a.selected span,
</br>
</br>
</br>
</br> .navigation .level0 li a:hover span
</br>
</br>
</br>
</br> {
</br>
</br>
</br>
</br> background: #b0b535 no-repeat top right !important;
</br>
</br>
</br>
</br> margin: 0 -10px 0 10px !important;
</br>
</br>
</br>
</br> padding: 4px 0px 0px 0px !important;
</br>
</br>
</br>
</br> height: 18px !important;
</br>
</br>
</br>
</br> width:140px;
</br>
</br>
</br>
</br> }
Ovaj sadržaj još nije ocijenjen. 
2793 Reputacija 345 Ukupno objava
ivanb

ivanb

5.12.2012. 15:33:53
Zoomicon,
I think you have a CSS issue here. You should position your .navigation ul ul to some other then current parent element, perhaps .navigation. Try that by assigning position: relative; rule to .navigation or some other parent container.

I hope this will help,
regards.
Ocjena 5,00, 1 glas(ova). 
459 Reputacija 55 Ukupno objava
Clipflair1

Clipflair1

19.12.2012. 11:21:01
FIXED! Thank you very much for your help.
+ MENU 2nd Level UI css configuration
  -     .navigation ul
    {
        padding: 4px 0 0 0;
        margin: 0;
        list-style: none;
        float: left;   
     
            /* added */
            position:relative;
    }
 
    .navigation ul ul
    {
    position: absolute;
    z-index: 5000;
        float: left;
    clear: both;
     
        /* changed */
        top:40px;
    }
Ovaj sadržaj još nije ocijenjen. 
159 Reputacija 18 Ukupno objava
ivanb

ivanb

19.12.2012. 11:26:13
You are welcome.
Ovaj sadržaj još nije ocijenjen. 
459 Reputacija 55 Ukupno objava
MonoX Nightly Builds MonoX Gallery MonoX Roadmap Mono Software at GitHub
Additional Resources

  • Send us an e-mail

MonoX is a Mono product. mono