Chrome not rendering HTML content? - html

for some reason my HTML is not rendering in chrome. For some reason, I am getting an odd webpage with just the IP Adress. I am not sure if it is something related to the server. Can anyone assist?

VSCode starts the live-server in your project directory, and that's essentially what you're seeing in your browser.
Just move the HTML file into this directory (folder) and try running the server again, preferably your cursor clicked in the HTML file.

Switch the name to index.html , that should help.

Related

my web pages are not opening until I turn vs code live server how can i fix it?

I really want someone to help me I have a serious issue with vs code live server everything is perfectly working but once I completed my project I can't open my web pages without turning the live server on, whenever I want to check my web pages I have to open it in the vs code then turn on the live server is there a way I can fix it I want to open web page directly rather first open it in vs code than turn on the live server...
Go to your folder where you have saved html file and then double click the html file so it will be be opened as a html document in your browser
Try to be more specific. What do you mean by "opening directly"? Do you mean double clicking the html-file? What are you coding? Only html/css or js with libraries?
What happens if you double click the html file?
Browser opens the html:
Does it open the browser and shows a page without styling? If you don't see your css applied you might have added a prepending slash to your css link. Change your css link to something similar as this (the path should point to your css file):
<link rel="stylesheet" href="css/style.css">
Note: their is no prepending slash in the href attribute value. A prepending slash will work in a live server environment but will fail when the browser reads the file locally (= double clicking).
Browser does not open html:
If your browser does not open when double clicking the html file your browser is not configured as the program to launch html files. You could instead drag your html file into an open browser window. And look on the internet how to change your settings to launch your favorite browser when double clicking html files.

After editing css in Chrome Developer Tools, css file does not load

I'm developing a basic web page with css file on my local machine and testing by opening the html file in the browser straight from the filesystem.
This works, but now since using the Chrome developer tools to play around with different styles by editing the css file under the Sources tab, whenever I refresh the page none of the CSS loads until I again edit it in the sources tab - just adding a return to the end is enough to load all the CSS.
Also, occasionally when refreshing the page, the Sources tab shows the contents of the css file as corrupt (a load of random characters)
I've run the css through a validator and that says it is all fine and there is no javascript on the page
I'm not a web developer so probably missing something obvious...
This is happening because you are editing css inside the Inspect Element (Chrome developer tools).
This is because the css literally lives on a webpage and it is pulled from your actual css file on your desktop (css file from the folder of your website).
Because of this, you are never actually changing an actual css on your computer, just in the browser, and that is temporary, because the same old css from your computer will load everytime you reload the page (untill you modify the css on your computer).
You should edit your changes in your actual css file on your computer inside your text editor (notepad++, visual studio code, atom, sublime text, etc ...).
That way, it is going to work as you want ! Hope you understood what I meant, if not, just tell me, so I can clarify again :)
Add this to the nginx configuration:
http {
include /etc/nginx/mime.types;
....
}
this solved it for me.
Thanks

Why does my html files get messed up when uploaded

So I've uploaded my html, css and js files via Pydio. But the site seems to get messed up. Can anyone tell me what happened to it and how to fix it?
Some of the google font I used shows up but some didn't. Also, the bootstrap grid doesn't show up like its supposed to be. The site also didn't scale according to screen size.
When I preview the website in Brackets, it looks perfectly fine.
Please help.
mean-design.com
I think that you forgot to upload some files.
Here is the list :
( click on the image to zoom in )
Sounds to me that you did not upload everything or there are some absolute paths in your code. If you copy everything you uploaded to another local machine, does it work then?
You can actually see which files are missing if you open the online version of your page in your webbrowser and have a look at the developer console (press F12 in Chrome, Ctrl+Shift+I in Firefox). In the console all missing files are stated in the logged errors.
Thanks to Relisora we even have a screenshot of the error console:
Check if you uploaded all files and if so, check their path and link tags.

HTML file behaves different in dirrerent servers

My first assignment in web programming class is to design a website without browser side and server side script.
I made an HTML 5 document, linked to a CSS file, all of them were validated in W3C validator, everything is good. I test the web page locally on my laptop on Chrome36, Firefox30 and IE11, all good.
But I'm required to upload it to University's server, all good in Chrome and firefox but IE, however I tried to put it on the server on my laptop and access it on IE from University's PC, it behaves all good.
Apache server on my laptop, access from Uni's PC
On Uni's server, access from Uni's PC
My lecturer says I'll lose mark if it behaves so, what could be the problem and how can I solve it? Do server settings affect html's behave? Thanks!
Also, if you want, you can access it via deakin.edu.au/~yshengk/a1
Maybe the html file can't see your css? Check file path's.
The only change I would see is the file and folder path looks different. Check whether you have used correct file/folder path. Try changing the CSS, JS, images folder path between relative folder path or absolute folder path.

Windows: creating Jekyll pages not working

Unable to render new page in browser. I'm on Win7 and have Ruby1.9.3 and DevKit installed. When I create a new Jekyll site everything works. I copied the index.html in root and renamed to about.html and that worked and was able to view both pages in the browser. I copied the about.html page and renamed to contact.html and the page fails to inherit the layout and only renders text content and Liquid tags in the browser. All of this is on my local machine. Thanks for any advice.
Repo: https://github.com/greenlightjspence/JekyllWin7/
I had similar problem today and after almost hour fighting with it I finally found that Visual Studio saved my file with 'UTF-8 with Signature' encoding which was causing issues. Changing file encoding to 'UTF-8 without Signature' helped. To change file encoding, open file (index.html in my case) and go to File->Advanced Save Options. Hope it will help you as well.
Looks like it's known issue mentioned on official Jekyll site (http://jekyllrb.com/docs/frontmatter/).