title: 404 error when attempting to load stylesheets
body: <p>I am very new to html/css/js, and teaching myself by building a personal website. However, when I attempt to run the website using http-server, the server reports 404 errors for the stylesheets when the page is loaded. The resources in question are found as expected when I open the html file directly w/o using http-server. I suspect that my problem is simply that I do not understand how to format pathnames correctly, but am not sure.</p>
  <p>The file structure:</p>
  <p><a href="https://i.stack.imgur.com/7YCcT.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/7YCcT.jpg" alt="screenshot of file structure" /></a></p>
  <p>My code from index.html:</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang=&quot;en&quot;&gt;
    &lt;head&gt;
      &lt;meta charset=&quot;UTF-8&quot;&gt;
      &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
      &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;ie=edge&quot;&gt;
      &lt;title&gt;Home&lt;/title&gt;
      &lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href = &quot;css/bootstrap.css&quot;&gt;
      &lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/style.css&quot;&gt;
    &lt;/head&gt;
    &lt;body&gt;
  </code></pre>
  <p>The errors generated on opening the page:</p>
  <pre><code>[2022-08-18T21:21:16.660Z]  &quot;GET /css/style.css&quot; &quot;Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:103.0) Gecko/20100101 Firefox/103.0&quot;
  [2022-08-18T21:21:16.662Z]  &quot;GET /js/index.js&quot; &quot;Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:103.0) Gecko/20100101 Firefox/103.0&quot;
  [2022-08-18T21:21:16.663Z]  &quot;GET /css/bootstrap.css&quot; Error (404): &quot;Not found&quot;
  [2022-08-18T21:21:16.667Z]  &quot;GET /css/style.css&quot; Error (404): &quot;Not found&quot;
  [2022-08-18T21:21:16.668Z]  &quot;GET /assets/images/ag.jpg&quot; &quot;Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:103.0) Gecko/20100101 Firefox/103.0&quot;
  [2022-08-18T21:21:16.669Z]  &quot;GET /js/index.js&quot; Error (404): &quot;Not found&quot;
  [2022-08-18T21:21:16.670Z]  &quot;GET /assets/images/ag.jpg&quot; Error (404): &quot;Not found&quot;
  [2022-08-18T21:21:16.689Z]  &quot;GET /js/index.js&quot; &quot;Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:103.0) Gecko/20100101 Firefox/103.0&quot;
  [2022-08-18T21:21:16.690Z]  &quot;GET /js/index.js&quot; Error (404): &quot;Not found&quot;
  </code></pre>
  <p>What I've tried:<br>
  Specifying the path using ../css/, ./css/, /css/, ~/css<br>
  Moving the css file into the same directory as index.html and changing the href to &quot;.css&quot;<br>
  Moving the index.html to the project root.<br>
  Changing the base href to ., ./, ../<br></p>
  <p>Where I've looked for answers:
  <a href="https://www.coffeecup.com/help/articles/absolute-vs-relative-pathslinks/" rel="nofollow noreferrer">https://www.coffeecup.com/help/articles/absolute-vs-relative-pathslinks/</a><br>
  <a href="https://stackoverflow.com/questions/39407189/get-404-error-for-style-css-not-found">GET 404 error for style.css not found</a><br>
  <a href="https://stackoverflow.com/questions/31017848/css-and-js-files-not-foundserver-responded-with-a-status-of-404-while-browsing">css and js files not found(server responded with a status of 404) while browsing application on iis7</a><br></p>
  <p>Now I'm at the &quot;Go take a walk and clear your head&quot; stage of troubleshooting, but thought I'd post here before I do so.  Any assistance is greatly appreciated!</p>