title: Proper implementation of CSS and JS into HTML
body: <p>I've been puzzled by this for a little while and am wondering if anyone can shed some light on this topic.  I have an HTML file, a CSS file (<code>stylesheet.css</code>), and a JavaScript file (<code>java.js</code>), all in the same directory (I know its advisable to separate files by type into different directories, but I'm just running some tests right now and it's convenient to have them share one).  By my understanding (I'm new to all three), the proper way to have HTML execute the CSS and JS files is by including them in the <code>&lt;head&gt; … &lt;/head&gt;</code> tag such as below.</p>
  
  <pre><code>&lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;Table Fixed Header&lt;/title&gt;
      &lt;link rel="stylesheet" href="stylesheet.css"&gt;
      &lt;script src="javascript.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  </code></pre>
  
  <p><strong>EDIT: new location of <code>&lt;script&gt; and &lt;link&gt;</code></strong></p>
  
  <pre><code>&lt;!-- More table is above this --&gt;
  &lt;tr&gt;
            &lt;td&gt;Data Column 1&lt;/td&gt;
            &lt;td&gt;Data Column 2&lt;/td&gt;
            &lt;td&gt;Data Column 3&lt;/td&gt;
            &lt;td&gt;Data Column 4&lt;/td&gt;
          &lt;/tr&gt;
        &lt;/tbody&gt;
    &lt;/div&gt;
    &lt;link rel="stylesheet" href="stylesheet.css"&gt;
    &lt;script src="javascript.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>Still, only the table with none of the styling or scripting appears </p>
  
  <p>This way, as HTML executes, it should interpret both the CSS and JS files and apply them to the rest of the HTML script.</p>
  
  <p>In my case, I have multiple tables written in the HTML and the JS provides fixed header scrolling and CSS just makes everything look better (obviously).  However, when I execute the code on my local server, only the raw HTML appears.  There are no errors in the console log.  What is happening here?</p>