Hi,

Hope some expert out there can help.

I have created a skin that looked fine but when I viewed it in Fiefox the submenu items are all displaced horizontally.

Whats the best way to control the positioning of the submenu items?

Thanks this is what I did:

 <tr>
           <td class="main_dnnmenu_rootitem" width="100%" valign="middle" align="center" nowrap>
                                    [MENU]</td>
 </tr>

and in the css:

.main_dnnmenu_container {
    background-color: transparent;
}

.MainMenu_MenuBar {
    cursor: pointer;
    cursor: hand;
    height:16px;
    background-color: Transparent;
}

.MainMenu_MenuItem {
    cursor: pointer;
    cursor: hand;
    color: #231e44;
    font-family: Verdana, Arial, Helvetica;
    font-size: 9pt;
    font-weight: normal;
    font-style: normal;
    border-left: white 0px solid;
    border-bottom: white 1px solid;
    border-top: white 1px solid;
    border-right: white 0px solid;
    background-color: Transparent;
}

.MainMenu_MenuItemSel {
    cursor: pointer;
    cursor: hand;
    color: #f9a02c;
    font-family: Verdana, Arial, Helvetica;
    font-size: 9pt;
    font-weight: normal;
    font-style: normal;
    background-color: Transparent;
}
.MainMenu_SubMenu {
    z-index: 1000;
    cursor: pointer;
    cursor: hand;
    background-color: #FFFFFF;
    filter:progid:DXImageTransform.Microsoft.Shadow(color='DimGray', Direction=135, Strength=3);
    border-bottom: #FFFFFF 0px solid;
    border-left: #FFFFFF 0px solid;
    border-top: #FFFFFF 0px solid;
    border-right: #FFFFFF 0px solid;
}


.main_dnnmenu_bar {
    cursor: pointer;
    cursor: hand;
    height:16px;
    background-color: Transparent;
}
.main_dnnmenu_item td { /*TD if menu option for using tables is on*/
    cursor: pointer;
    cursor: hand;
    color: #231e44;
    font-size: 9pt;
    font-weight: bold;
    font-style: normal;
    background-color: Transparent;
    font-family: font-family:Verdana, Arial, Helvetica, sans-serif;
    white-space: nowrap;  /*Word wrapping menu item now optional*/   
    padding: 1px 3px 3px 1px;   
}

.main_dnnmenu_rootitem  { /*TD if menu option for using tables is on*/
    cursor: pointer;
    cursor: hand;
    color: #231e44;
    font-size: 9.0pt; 
    font-style: normal;
    background-color: Transparent;
    font-family: font-family:Verdana, Arial, Helvetica, sans-serif;
    white-space: nowrap;  /*Word wrapping menu item now optional*/       
    padding: 0px 12px 0px 5px;   /*explicitly set padding for root menu items*/
}


.main_dnnmenu_itemhover { 
    background-color: #fca71b;
}

.main_dnnmenu_itemhover td { 
    background-color: #fca71b;
}


.main_dnnmenu_icon {
    cursor: pointer;
    cursor: hand;
    text-align: center;
    width: 15px;
    height: 100%;
}
.main_dnnmenu_submenu {
    background-color: #fff; 
    z-index: 1000;
    cursor: pointer;
    cursor: hand;
    filter:progid:DXImageTransform.Microsoft.Shadow(color='#696969', Direction=135, Strength=3);
    padding: 1px 1px 1px 1px;   /*explicitly set padding for sub-menus */
}
.main_dnnmenu_break {
    height: 1px;
    font-size: 1px;
}

.main_dnnmenu_arrow {
    border-right: #cccccc 1px solid;
    border-bottom: #cccccc 1px solid;
    border-top: #cccccc 0px solid;
    font-family: webdings;
    font-size: 10pt;
    cursor: pointer;
    cursor: hand;
}
.main_dnnmenu_rootmenuarrow {
    font-family: webdings;
    font-size: 10pt;
    cursor: pointer;
    cursor: hand;
}

The url is:

http://caresys.co.uk/testwebsite/

Any ideas what could cause this?

THIS SOLVED THE ISSUE.

Many thanks

"note that your page references the container.css and skin.css multiple times"

In what way? Could you expand on this?

Thanks again.