public_html is the domain root, so if you have http://www.domain.com/ , the last / means 'public_html'. If you are linking to a file visible from the web you will not use public_html/ as part of the path.
First example should just be href="main.css", if it doesn't find it. Put href="/main.css".
What you are encountering is relative vs absolute paths. Note this applies to files accessed via the web not to files accessed via the file system. A relative path starts from the current directory. An absolute URL starts from the web root (public_html/) in this case.
Some examples :
public_html/
public_html/index.html
public_html/style.css
public_html/css/book.css
public_html/docs/chapter1/index.html
Let's start with including the style.css from the web root index.html .
href="style.css" will load it. If we wanted to include style.css from docs/chapter1/index.html we would have to use the correct path. The simplest option is to use an absolute URL.
href="/styles.css"
Additional there's a method to define the current directory. Use ./' to tell the path to start from the current directory (of the file it's displaying). If you want to go up one level use ../. To reach the style.css from doc/chapter1/index.html we could use ../ multiple times until we hit the web root.
href="../../style.css"
In doc/chapter1/index.html we actually want to use the /css/book.css instead of style.css. Furthermore there's like 10 chapters each with their own folder and we need to access it those files as well. You can decide what you rather do ...
href="/css/book.css" or href="../../css/book.css"
If possible use relative URLs. It will let you move files around a little bit easier. Use absolute URLs when it's convenient for you. In the case of 10 chapters in their own folders, I would opt for using the absolute URL.
When you create Anchor links, you will use those same guidelines for linking. To link the home page from docs/chapter1/index.html to /index.html, you would use the / to signify it works from the web root directory. If you had additional files in docs/chapter1/ , you would just use index.html. Say there was a lesson.html and exercises.html.
The next part that might be a gotcha is how CSS includes files. It works from the directory the CSS file resides. This is why you see css/images, css/fonts; it uses the same mechanisms for including files ( ./ , ../ and / is the web root).
Yes, it will get messy if you put all your files in the web root. Directories work though to reduce the clutter and server side languages provide the ability to route through a single file all requests. That helps.
That either cleared it up or you're totally confused.
meant to map these to the web :
public_html/
http:///www.domain.com/
public_html/index.html
either : http:///www.domain.com/
http:///www.domain.com/index.html
public_html/style.css
http:///www.domain.com/style.css
public_html/css/book.css
http:///www.domain.com/css/book.css
public_html/docs/chapter1/index.html
http:///www.domain.com/docs/chapter1/
or
http:///www.domain.com/docs/chapter1/index.html