javascript - When step am I missing from moving a premade code from Codepen into my Brackets project? -

Here's a codepay. I'm trying to work:

Here my key is the index. The html file is in my brackets project:

  & lt; Head & gt; & Lt; Link rel = "stylesheet" href = "http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" & gt; & Lt; Link type = "text / css" rel = "stylesheet" href = "css / style.css" /> & Lt; Script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" & gt; & Lt; / Script & gt; & Lt; Script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" & gt; & Lt; / Script & gt; & Lt; / Head & gt;  

When I try to run it, it runs about 90% correctly, but this is not a complete match. The menu is misguided incorrectly, and I can see the bullet points which were not before, and the padding is all wrong.

EDIT: Here is an image that is about how I am getting:

How can I get a complete replica of the codepeed code in my project? ? Edit 2:

Here's my little modified HTML. The problem persists

   & Lt; Script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" & gt; & Lt; / Script & gt; & Lt; Script src = "js / init.js" & gt; & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Ul class = "navbar cf" & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Item 2 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Item 3 & lt; / A & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub item 1 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub item 2 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub item 3 & lt; / A & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Google & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "" & gt; Yahoo! & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "" & gt; JQuery & lt; / A & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub sub item 1 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub All Subject 2 & lt; / A & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub sub sub item 1 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub sub sub item 2 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub sub sub item 3 & lt; / A & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub item 1 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub item 2 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub item 3 & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub sub item 3 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub sub item 4 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sub sub-item 5 & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Items awhile & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Item 4 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Item 5 & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Body & gt; & Lt; / Html & gt;  

Here the sections are resolved which resolves those issues: / P>

  `hal, ul '{list-style: none; } `