Logical menus - LISEGA | a trip through our world of pipe supports

body {behavior: url(http://www.lisega.de/modules/mod_lxmenupro/csshover.htc);} .moduletable div#topmenu1lxmenupro, .module div#topmenu1lxmenupro, div#topmenu1lxmenupro { background: transparent; width: 800px; } .moduletable div#topmenu1lxmenupro ul, .module div#topmenu1lxmenupro ul, div#topmenu1lxmenupro ul { margin: 0; padding: 0; } .moduletable div#topmenu1lxmenupro li, .module div#topmenu1lxmenupro li, div#topmenu1lxmenupro li { float: left; position: relative; list-style: none; margin: 0; padding: 0; height: auto; width: 160px; background-color: #000080; background-image: none; } .moduletable div#topmenu1lxmenupro li:hover, .moduletable div#topmenu1lxmenupro li.currentsub, .module div#topmenu1lxmenupro li:hover, .module div#topmenu1lxmenupro li.currentsub, div#topmenu1lxmenupro li:hover, div#topmenu1lxmenupro li.currentsub { background-color: #336699; background-image: none; z-index: 20; } .moduletable div#topmenu1lxmenupro li.mainitem, .module div#topmenu1lxmenupro li.mainitem, div#topmenu1lxmenupro li.mainitem { height: 20px; width: 100px; background-color: #000080; } .moduletable div#topmenu1lxmenupro li.mainitem:hover, .moduletable div#topmenu1lxmenupro li.currentmain, .module div#topmenu1lxmenupro li.mainitem:hover, .module div#topmenu1lxmenupro li.currentmain, div#topmenu1lxmenupro li.mainitem:hover, div#topmenu1lxmenupro li.currentmain { background-color: #336699; } .moduletable div#topmenu1lxmenupro li a, .module div#topmenu1lxmenupro li a, div#topmenu1lxmenupro li a { display: block; padding-top: 4px; padding-right: 3px; padding-bottom: 5px; padding-left: 3px; color: #FFFFFF; font-size: 11px; font-family: tahoma,verdana,arial; font-weight: bold; text-align: left; text-transform: none; direction: ltr; unicode-bidi: bidi-override; text-decoration: none; border-style: solid; border-color: #336699; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 0px; border-left-width: 1px; width: auto; height: auto; } .moduletable div#topmenu1lxmenupro li:hover>a, .moduletable div#topmenu1lxmenupro li.currentsub>a, .module div#topmenu1lxmenupro li:hover>a, .module div#topmenu1lxmenupro li.currentsub>a, div#topmenu1lxmenupro li:hover>a, div#topmenu1lxmenupro li.currentsub>a { color: #FFCC00; font-weight: bold; text-align: left; text-transform: none; direction: ltr; unicode-bidi: bidi-override; text-decoration: none; border-style: solid; border-color: #336699; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 0px; border-left-width: 1px; } .moduletable div#topmenu1lxmenupro li.mainitem>a, .module div#topmenu1lxmenupro li.mainitem>a, div#topmenu1lxmenupro li.mainitem>a { padding-top: 3px; padding-right: 0px; padding-bottom: 1px; padding-left: 3px; color: #FFFFFF; font-size: 11px; font-family: tahoma,verdana,arial; font-weight: bold; text-align: left; text-transform: none; direction: ltr; unicode-bidi: bidi-override; text-decoration: none; border-top-width: 0; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; } .moduletable div#topmenu1lxmenupro li.mainitem:hover>a, .moduletable div#topmenu1lxmenupro li.currentmain>a, .module div#topmenu1lxmenupro li.mainitem:hover>a, .module div#topmenu1lxmenupro li.currentmain>a, div#topmenu1lxmenupro li.mainitem:hover>a, div#topmenu1lxmenupro li.currentmain>a { color: #FFCC00; font-weight: bold; text-align: left; text-transform: none; direction: ltr; unicode-bidi: bidi-override; text-decoration: none; border-top-width: 0; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; } .moduletable div#topmenu1lxmenupro ul.level1 a, .module div#topmenu1lxmenupro ul.level1 a, div#topmenu1lxmenupro ul.level1 a { width: auto; } .moduletable div#topmenu1lxmenupro li.folder>a, .module div#topmenu1lxmenupro li.folder>a, div#topmenu1lxmenupro li.folder>a { } .moduletable div#topmenu1lxmenupro>ul a, .module div#topmenu1lxmenupro>ul a, div#topmenu1lxmenupro>ul a { width: auto; } .moduletable div#topmenu1lxmenupro ul ul, .module div#topmenu1lxmenupro ul ul, div#topmenu1lxmenupro ul ul { display: none; position: absolute; width: 160px; } .moduletable div#topmenu1lxmenupro li.folder li.folder>a, .module div#topmenu1lxmenupro li.folder li.folder>a, div#topmenu1lxmenupro li.folder li.folder>a { background-image: url(http://www.lisega.de/modules/mod_lxmenupro/images/symbol/arrow_wr1.gif);background-position:98% 50%;padding-right:15px; background-repeat: no-repeat; } .moduletable div#topmenu1lxmenupro ul.level0 li.folder:hover ul.level1, .moduletable div#topmenu1lxmenupro ul.level1 li.folder:hover ul.level2, .moduletable div#topmenu1lxmenupro ul.level2 li.folder:hover ul.level3, .moduletable div#topmenu1lxmenupro ul.level3 li.folder:hover ul.level4, .moduletable div#topmenu1lxmenupro ul.level4 li.folder:hover ul.level5, .moduletable div#topmenu1lxmenupro ul.level5 li.folder:hover ul.level6, .moduletable div#topmenu1lxmenupro ul.level6 li.folder:hover ul.level7, .moduletable div#topmenu1lxmenupro ul.level7 li.folder:hover ul.level8, .moduletable div#topmenu1lxmenupro ul.level8 li.folder:hover ul.level9, .module div#topmenu1lxmenupro ul.level0 li.folder:hover ul.level1, .module div#topmenu1lxmenupro ul.level1 li.folder:hover ul.level2, .module div#topmenu1lxmenupro ul.level2 li.folder:hover ul.level3, .module div#topmenu1lxmenupro ul.level3 li.folder:hover ul.level4, .module div#topmenu1lxmenupro ul.level4 li.folder:hover ul.level5, .module div#topmenu1lxmenupro ul.level5 li.folder:hover ul.level6, .module div#topmenu1lxmenupro ul.level6 li.folder:hover ul.level7, .module div#topmenu1lxmenupro ul.level7 li.folder:hover ul.level8, .module div#topmenu1lxmenupro ul.level8 li.folder:hover ul.level9, div#topmenu1lxmenupro ul.level0 li.folder:hover ul.level1, div#topmenu1lxmenupro ul.level1 li.folder:hover ul.level2, div#topmenu1lxmenupro ul.level2 li.folder:hover ul.level3, div#topmenu1lxmenupro ul.level3 li.folder:hover ul.level4, div#topmenu1lxmenupro ul.level4 li.folder:hover ul.level5, div#topmenu1lxmenupro ul.level5 li.folder:hover ul.level6, div#topmenu1lxmenupro ul.level6 li.folder:hover ul.level7, div#topmenu1lxmenupro ul.level7 li.folder:hover ul.level8, div#topmenu1lxmenupro ul.level8 li.folder:hover ul.level9 { display:block; } .moduletable div#topmenu1lxmenupro ul.level1, .module div#topmenu1lxmenupro ul.level1, div#topmenu1lxmenupro ul.level1 { top: 20px; left: 0px; } .moduletable div#topmenu1lxmenupro ul.level2, .moduletable div#topmenu1lxmenupro ul.level3, .moduletable div#topmenu1lxmenupro ul.level4, .moduletable div#topmenu1lxmenupro ul.level5, .moduletable div#topmenu1lxmenupro ul.level6, .moduletable div#topmenu1lxmenupro ul.level7, .moduletable div#topmenu1lxmenupro ul.level8, .moduletable div#topmenu1lxmenupro ul.level9, .module div#topmenu1lxmenupro ul.level2, .module div#topmenu1lxmenupro ul.level3, .module div#topmenu1lxmenupro ul.level4, .module div#topmenu1lxmenupro ul.level5, .module div#topmenu1lxmenupro ul.level6, .module div#topmenu1lxmenupro ul.level7, .module div#topmenu1lxmenupro ul.level8, .module div#topmenu1lxmenupro ul.level9, div#topmenu1lxmenupro ul.level2, div#topmenu1lxmenupro ul.level3, div#topmenu1lxmenupro ul.level4, div#topmenu1lxmenupro ul.level5, div#topmenu1lxmenupro ul.level6, div#topmenu1lxmenupro ul.level7, div#topmenu1lxmenupro ul.level8, div#topmenu1lxmenupro ul.level9 { top: 0px; left: 160px; }

#topmenu1_menu { display: none; }

Design Development Tools

Logical menus

Logical Menus

A logical menu follow up guides the user through the design process

Further Links
	LICADplus download
	LICADplus brochure (PDF)

< Prev		Next >