How do I create an html link for a menu item?


I am new to semantic-ui and I used an example menu setup to which I want to make the menu items links to html.
I do not seem to be able to do this without causing the menu to be display badly.
The dropdown menu items appear on the same line as the main item.

Sticky Example - Semantic body { background-color: #FFFFFF; } .main.container { margin-top: 1em; } { margin-top: 0.5em; border-radius: 0; border: none; box-shadow: none; transition: box-shadow 0.5s ease, padding 0.5s ease ; } .item img.logo { margin-right: 1.5em; } .overlay { float: left; margin: 0em 5em 1em 0em; } .overlay .menu { position: relative; left: 0; transition: left 0.5s ease; } { background-color: #FFFFFF; border: 1px solid #DDD; box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.2); } .overlay.fixed .menu { left: 900px; } .text.container .left.floated.image { margin: 2em 2em 2em -4em; } .text.container .right.floated.image { margin: 2em -4em 2em 2em; } .ui.footer.segment { margin: 5em 0em 0em; padding: 5em 0em; } .landpage-image{ height: 55%; } .landpage-image{ background-image: url(/images/Lighthouse.jpg); background-repeat: no-repeat; background-size: cover; background-attachment: fixed; }
Home Products
Google Zdnet