I am using dev_tools_hot_reload=False like below and I have style.css file in asset folder. I am wondering if I can still refresh CSS file only? From below website, it does say " If only CSS changed, then Dash will only refresh that CSS file.". However after I use dev_tools_hot_reload=False, changing CSS file will not refresh my page style.
Thanks
app.run_server(mode='external',debug=True,port=8050,dev_tools_hot_reload = False)
https://dash.plotly.com/devtools
Related
This is pretty much my first go at HTML and CSS. I thought I was getting a hang of it until I added more pages. I wanted each page to have the same top navigation bar format, but when I linked the same CSS Stylesheet to all of my pages it just doesn't want to work? How should I go about fixing this?
Also, somehow my google fonts link did work at first, but once I added in the pages and tried linking the single stylesheet to all the pages, it stopped working completely.
Here's what is going on:
index.html file code & link href to css
Preview of index.html/my homepage
menu.html file code & link href to the same css stylesheet
Preview of menu.html/menu page
My CSS stylesheet
The preview works with index.html, but when I navigate to the menu page, or contact page I have created through the preview, it completely breaks and doesn't have the navigation bar I created across all the pages at all.
Did I do something wrong here? I tried creating multiple CSS files and gave them different names since each page is going to look different anyways, but kept the html the same across all the other html pages and the css the same.
The reason why the css script is working for the index page only is because index.html is the only script that has the right directory to your css script. So the browser can't find the css script as a result. Remember that the other pages are not in the same location as index.html (they are in Pages instead of the root directory). All you would have you do is just change the directory path on the other scripts.
Add this on all your other scripts (excluding index.html):
<link rel="stylesheet" href="../CSS/style.css"/>
It should work after this.
Here is an example:
Your actual problem is not knowing how to navigate from one/folder to another. This link below will help you further on how to navigate around folders.
https://learn-the-web.algonquindesign.ca/topics/paths-folders/
Don't take out the files from Pages but leave them where they, all you need to do is to change the path to the different files. You'll see how I did on the screenshots above.
If I had more time I would go more in detail but this should be sufficient info for you to solve the problem and understand what mistakes you made. I hope this helps.
Whenever I make changes to files I am hosting for my website, like the CSS files, they never update. Even after deleting the original CSS files everywhere, using Chrome's inspect element still shows that the websites HTML is being styled by the "style.css" file that doesn't exist. The only way I have found around this is by changing the HTML pages to be styled by a "style2.css", and renaming my updated CSS file to "style2".
Is this not insanely weird? Ghost files? I'm not going crazy right?
Try refreshing with CTRL+F5 instead of only F5
This will clear the already cached files like css and js and will reload the updated ones
Let's say you have style.css
with
.body{
background-color:white;
}
after that you change the same style.css file to
.body{
background-color:black;
}
sometimes the navigator won't read the new code in css/js
and will load the old ones unless you clear them
This could be your problem, try it and check again
Or you could check out this case : How to force the browser to reload cached CSS and JavaScript files
enter image description here
I am trying to create a website with bootstrap, but wanted to add some css of my own.
I have made a folder and have added my html file, not named index and in the same folder is my css file, and have linked it just after the CDN line of the bootstrap code, but the css file is not working due to some reason, and I can not figure out why.
Edit: So after I put the reference link just below the CDN line of the bootstrap code, of my own custom css. It should be working and my html should get updated, but I do not see the changes. Initially I thought it is because of the different folder, but even after putting it all into the same folder the webpage is not updating.
Try this:
<link href="~/FolderName/Petvrs.css" rel="stylesheet" />
Or drag and drop this css file inside HTML page it's must work.
I am trying to practice some web development with a simple HTML file and some external styling. I have my HTML and CSS files saved in the same folder, and am attempting to link the CSS to my HTML file. When I go to view the page, none of the styling is applied. There is a file called "styles.css" loaded into the sources tab, but it just looks like my HTML file. The HTML included is from the file I want to link by the name of the file in the sources. You can see the link attempt (I've tried with and without specifying type, and I've tried putting a slash in front of the name of the file), and you can see the file included in sources:
I've looked at each element, I've looked at the computed styles, and nothing suggests that the file is properly loaded. I've looked through several questions and most of the solutions are things I've already tried. Thanks!
Make sure the index file is saved as a .html file.
If it's still not working try href="./styles.css"
try writing href="./style.css"
I have project. I used HTML and external CSS. But when I create CSS file and save it, it works. But when i add more data in the CSS file, It only load the previous CSS. The new CSS file i added recently it's not working.
So i have to always create new separate CSS file on every page before I save it. I don't know how to make it works using only single CSS file for my project on my base UI.
and if i copy that style to the body of HTML(inline CSS) it's totally working. But when i added that file into style.CSS it's not working unless i create new file CSS.
Do you know how to solve this?
The static resources are probably getting cached in your browser. Try to do hard-refresh your page by pressing Ctrl + F5 or Ctrl + click refresh button.
https://www.getfilecloud.com/blog/2015/03/tech-tip-how-to-do-hard-refresh-in-browsers/