HTML5 Toolbar Menu

HTML

<menu type="toolbar">
    <menu label="File">
        <command onclick="fnew()" label="New..." />
        <command onclick="fopen()" label="Open..." />
        <command onclick="fsave()" label="Save" />
        <command onclick="fsaveas()" label="Save as..." />
    </menu>
    <menu label="Edit">
        <command onclick="ecopy()" label="Copy" />
        <command onclick="ecut()" label="Cut" />
        <command onclick="epaste()" label="Paste" />
    </menu>
    <menu label="Help">
        <command href="help.html" label="Help" />
        <command href="about.html" label="About" />
    </menu>
</menu>

CSS

menu {
    list-style-type:none;
    background:grey;
    padding:0px;
    margin:0px;
}
menu:before, command:before {
    border:1px solid lime;
    display:block;
    content:attr(label);
}
menu[type=toolbar] {
    position:relative;
}
menu[type=toolbar]>menu, menu[type=toolbar]>comman {
    display:inline-block;
    position:relative;
    border:1px solid red;
}
menu[type=toolbar]>menu>menu, menu[type=toolbar]>menu>command {
    visibility:hidden;
    display:block;
    height:0px;
}
menu[type=toolbar]>menu:hover>menu, menu[type=toolbar]>menu:hover>command {
    //position:absolute;
    visibility:visible;
    height:auto;
    background:yellow;
    border: 1px solid blue;
}