Atom-Live-Server vs Browser

Question

I'm working on a project in Atom with atom-live-server. I have a header, with a background image behind the text. The live server is not rendering the image, while Chrome renders the image fine.

Is there a distinct difference between live-server and browsers that I should now about? I find it strange that it's not working consistently across the server and browser.

HTML:

<h1 id="header">Dasmoto's Arts & Crafts</h1>

CSS:

#header{
  font-family: Helvetica;
  font-size: 100px;
  font-weight: bold;
  color: khaki;
  text-align: center;
  background-image: url("/Users/Elijah/Desktop/HTML_Projects/Dasmoto/Resources/images/pattern.jpeg");
}

Also, when I change the URL to the below code, it works fine. Does it have anything to do with local files?

background-image: url("https://s3.amazonaws.com/codecademy-content/courses/freelance-1/unit-2/pattern.jpeg");
CSS: