Hi,
I started my quest to use the DNNmenu in DNN 4.9 in the Skinning Forum - but from what I gather, everyone there seems to have given up on DNNmenu and is pointing me to functioning third party solutions (which I do appreciate, as this may be the way I ultimately will have to go).
But call me stubborn/naive: Considering that DNNmenu is the official/supported replacement of the SolPartMenu (which implies to me that it ought to be very stable and mature), I thought I was acting quite responsible and reasonable to expect that DNNmenu should AT LEAST work for even the most basic of all skins that one can dream up.
Hopefully, posting here will either lead to someone pointing out MY error (since there is no documentation where I could help myself), or point me to the proper procedure that I'm supposed to follow to report the issues as official bugs so that a patch/update can be released.
In the following screen shot you'll notice the following "issues" (I inserted background colors into the CSS to easily show the size of each element):
a) The submenus are totally out of visual context of the main menu, shifted down AND to the right. The page's main DIV container has position:relative - but there is NO absolute positioning (yet) in that most basic of skins. I've since read in this forum that other's have already reported this for a while - but I can't quite believe that a major usability impairment of a key feature of any product (it's main menu) would not be given the highest priority? What good is any product if you can't even get the menu to work?
b) The "green" background is the "CSSControl". It has a style of HEIGHT and LINE-HEIGHT of 22 px - both settings have no effect in standards mode
c) The "blue" background is the "CSSNodeRoot". In utter desperation I also gave THAT a style of HEIGHT and LINE-HEIGHT of 22 px - no such luck in standards mode.
Which style is the correct one to set the height so that the background of each root node will extend to the full height of the menu bar (in my case 22px)?
Here the skin and CSS that goes with that example:
<%
Control language="vb" AutoEventWireup="false" Explicit="True" Inherits="DotNetNuke.UI.Skins.Skin" %>
<%@ Register TagPrefix="dnn" TagName="NAV" Src="~/Admin/Skins/Nav.ascx" %>
<div id="ControlPanel" runat="server"></div>
<div id="skin_testing">
<div id="skin_MenuBar">
<dnn:NAV runat="server" ID="dnnNAV"
ProviderName="DNNMenuNavigationProvider"
IndicateChildren="true"
ToolTip="Title"
CSSControl="Main_DNNMenu"
CSSNodeRoot="Main_DNNMenu_NodeRoot"
CSSNodeHoverRoot="Main_DNNMenu_NodeHoverRoot"
CSSContainerSub="Main_DNNMenu_ContainerSub"
CSSNode="Main_DNNMenu_Node"
CSSNodeHover="Main_DNNMenu_NodeHover"
/>
</div>
<div id="ContentPane" runat="server"></div>
</div>
#skin_testing
{
width: 600px;margin: 0 auto 0 auto; /* Centers page horizontally */
position: relative; /* Now child elements can use absolute positioning */
}
#skin_MenuBar
{
}
width: auto;height: 22px;background: red;
*.Main_DNNMenu
{
}
height: 22px;line-height: 22px;background: green;
*.Main_DNNMenu_NodeRoot
{
margin: 0 1em 0 0;padding: 0 1em 0 1.2em; /* Space between menu items */
}
font: bold 11px tahoma, arial, helvetica, sans-serif;color: White;background: blue;height: 22px;line-height: 22px;
*.Main_DNNMenu_NodeHoverRoot
{
}
color: #9f9f9f;