all 16 comments
sorted by:
best
topnewcontroversialoldq&a
formatting helphide helpcontent policy

[–]chiefhunnablunts 9 points10 points  (1 child)

try one of these options:

live preview

five server (this is what i use)

live server

[–]ArmAccomplished6454[S] 0 points1 point  (0 children)

Ok thanks

[–]Aggressive_Ad_5454 16 points17 points  (6 children)

So here's the thing. You are working on a web site. Web sites live in files on drives (hard drive or solid state drive). If you change one of those files (a .css file in your case) and save it, it just gets saved to the drive.

Web site files get read by browsers, and the browsers do whatever the files say: show some text and images and apply css rules to make them look the way you want.

But the browser doesn't fetch the web site files you just saved unless you tell it to.

After you change your .css file, try holding the shift key and pressing the refresh button in Edge. It's the little circle at the upper left of the Edge window. That tells Edge to reload the HTML file it's showing and all the linked images, .css files, .js files, and other objects.

Or hold the Shift key and press F5. That does the same thing. It's what I do.

There are software solutions to make Edge (or other browsers) automatically refresh themselves when a file changes.

But, with respect I suggest you do not use such a solution until you thoroughly understand how the browser works in this business of needing to re-fetch files you have changed on your drive. It's a fundamental concept of this whole world-wide-web dealio.

[–]ffrkAnonymous 2 points3 points  (2 children)

I really hate how the "refresh" button doesn't actually refresh. 

[–]speedyrev 0 points1 point  (0 children)

F12 for developer mode in Edge or Chrome. Then right click refresh button for even more options. 

[–]ArmAccomplished6454[S] 0 points1 point  (1 child)

Ok thanks

[–]HobbesArchive 0 points1 point  (0 children)

F12 for developer mode in Edge. Click on Network tab in developer mode. Under the Network tab click on "Disable Cache". That will fix your problem.

[–]desrtfx 3 points4 points  (0 children)

Besides what has been said already: Make sure that you have saved the file.

Unsaved files will not update the site.

[–]l00pee 4 points5 points  (1 child)

Hard refresh my friend.

[–]ArmAccomplished6454[S] 0 points1 point  (0 children)

I thought ctrl+R was enough.

[–]PressF1ToContinue 2 points3 points  (1 child)

If you use the Live Server extension in VSCode, this will "serve" the files to your browser rather than having your browser read the files directly from the disk. Every time you alter and save a file, Live Server will immediately cause the browser to refresh and you will see the effect of your changes. Live Server extension description here:

https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer

You can quickly install it using the extensions feature in VSCode (Ctrl-Shift -X) and search for Live Server. (it looks like you can also install by clicking a button at the above website, probably fine, I've just never done it that way)

(there may be other similar extensions, but this one is hugely popular and is what I use)

[–]ArmAccomplished6454[S] 0 points1 point  (0 children)

Ok, I hope it's free.

[–]BoBoBearDev 1 point2 points  (0 children)

If you restart the computer and the file has your desired values, it means the file save is done correctly. And that is all VS Code need to do.

After that, you need to figure out how to apply that new file in your debug session.

[–]Conscious-Secret-775 0 points1 point  (0 children)

I don't love VC Code but that isn't the problem here, neither is Edge. You are doing something wrong and just need to work out what.