Where are the style sheets in a MVC application?

Question

_{Monday, January 6, 2020 10:00 PM}

Hi All,

Where are the style sheets located in an MVC applications..

When I look into the pre built files in the solution explorer there are many  many files with .css but I am not sure if all those files are style sheets.

Please note that these files  were made by the visual studio wizard and no me.

But I found this write up and this is the exact issue that I am having so I am trying to follow their solution.

The Solution answer is the following:

I had the same problem. Using firebug (firefox debbing tool, "net" tab) I saw that jQuery was looking for the images in the same place the stylesheet was located. Moved the images there... fixed.

Thanks All!

All replies (6)

_{Tuesday, January 7, 2020 7:15 PM ✅Answered}

The css code can be written at different places like

a) Directly in your view file(.cshtml/.aspx).

b) Separate css files inside Content/css folder.

_{Monday, January 6, 2020 10:45 PM}

Where are the style sheets located in an MVC applications..

The default in the ASP.NET MVC templates is /Content but you can place css files wherever you like.

_{Monday, January 6, 2020 10:52 PM}

it will depend on which MVC template you are using. all if you add any jQuery plugin that requires a stylesheet, you will need to follow their rules.

It will also depend on if you are using any bundling software. budling sodt will input many .css files and output a *.min.css. or if using the web optimizations library, the file is generated at runtime.

you could also be using a webpack bundler. 

another common approach is using a CDN or a CDN with a local fallback.

the browsers debugging tools are your friend here to what is actually loaded.

_{Tuesday, January 7, 2020 7:02 PM}

Hmm can you be more specific here how can I tell whats loaded by using the browser f12 options.

I am not trying to add anything that the wizard did not add automatically when I built the asp application.

If there is bundles it was what ever the wizard made... so I am not even sure.

There is a bundle file in the application so there must be bundles in the program.

I am fearful of changing anything that is working in the program. I attempted one time to try the telerik junk

but it does nothing so there will not be any changes to the look of the application.

_{Tuesday, January 7, 2020 7:26 PM}

Hmm can you be more specific here how can I tell whats loaded by using the browser f12 options.

F12 opens the browser's developer tools which is a suite of debugging tools within the browser.   A missing image reference will cause a a 404 (Not Found) status response in the Network View.   Keep in mind, the community recommended several times to open Dev Tools and look for errors as a troubleshooting step.  You should familiarize yourself with developer tools as they will save you (and us) a lot of time.

If there is bundles it was what ever the wizard made... so I am not even sure.

Seems reasonable to learn the libraries features implemented in your project even if the "wizard" added the libraries. 

I am fearful of changing anything that is working in the program. I attempted one time to try the telerik junk

but it does nothing so there will not be any changes to the look of the application.

As recommended several times, create a new project where you can test without affecting the production application.   

_{Wednesday, January 8, 2020 5:41 PM}

Thanks for all the help every one.

Its clear as mud but this web stuff is very confusing.  LOL!

I will never be good at it but I do appreciate the help!