Same HTML source files but display differently - html

I'm new to bootstrap. I want to use the bootstrap on my previous project. But once I included the bootstrap.min.css it failed, while it can work fine if I create a new html from scratch.
I've uploaded the sample files in GitHub: https://github.com/kid551/toolbox/tree/master/bootstrapSameFiles . You can check that the test.htm and test2.htm are the same files but they will display differently like this:
test.htm:
=============================
=============================
test2.htm:
=============================
=============================
I think you can rebuild this issue by directly downloading from GitHub.
I don't know why it happens and how I fixed this.
Thanks.

You're running into some encoding issues. Even though your code base seems to be the same - it isn't. Let me show you visually.
The moment I switch from UTF-8 to UTF-16 BE, your working versions (test.htm) code gets cryptic, while the other one seems to be pretty well working.
test.htm (UTF-16 BE)
test2.htm (UTF-16 BE)
So eventually you might have copied your code from somewhere else or even used a wrong encoding.
EDIT
You can test that with any editor which is able to show you some code. Just try to delete a linebreak by hitting backspace at the first index of a row. You'll notice on almost every row that you're not deleting the linebreak but an 'invisible character' instead. So that again means, you're just not able to see those charecters your editor is not able to encode properly.

I have downloaded your source from the GIT. You are right both are similar but there is something wrong with the test2.htm file. I have NetBeans installed on my local. When I open test2 file its showing source as empty in NetBeans.But if I open the same file using notepad++ it's showing the source. So maybe file is corrupted. What I suggest is try to create the new file or use NetBeans. After saving using NetBeans its displaying same as test.html

Related

CSS issue in vs code

I'm new in VS Code and I'm trying to figure out what went wrong here because css won't work for me. The link is good because it opens with click + ctrl. Both files are in the same folder. So why isn't it working?
Edit saved:
Seems like you didn't save index.html. See the round dot? It means it's not saved.
Your code seems fine. Also, it's always better to use a browser than using built in preview.
Use an browser and save your files changes for see your proyect.
Save file and try opening it with a browser. I always prefer browser to test a file. Sometimes 2 browsers if it has a problem. I suggest you to use sublime text 3 or notepad ++ with vs code because it can save you from a lot of headaches. :)

is there a place online to upload a json file and export it in html?

I have bookmarks downloaded from firefox and they are a json file.
I'm searching for a site where I can upload the json file and then download it in html format.
Does such a site exist?
THANK YOU for your kind assistance.
(Every time I do a search for this question, your site comes up.)
I don't know of a site that will do this online, but I do know of a few other ways:
You could restore them back into a Firefox profile and then export them as HTML from there, like this:
You could download and run a program like https://github.com/andreax79/json2html-bookmarks to convert them locally
You could use JavaScript to convert them in-browser, though not with an actual site, like this: Quick and dirty way to parse a mozilla firefox json file
If you need to display JSON, try with the firefox extension named jsonview.
Check out CodeBeautify, just paste and hit the Beautify button https://codebeautify.org/json-to-html-converter
There’s a lot of plugins and add ons for almost every browser out there; Firefox and especially chrome have great ones as others have mentioned, it’s worth checking out.
You are making it harder than it is. There is no JASON to HTML conversion required. Go to C:\Users\Username\AppData\Local\Google\Chrome\User Data\Default and find bookmark.file. Save it to your desktop. Uninstall the browser but also check the box that asks whether you want to keep history, etc.
Reinstall the browser, then add the bookmark.file to C:\Users\Username\AppData\Local\Google\Chrome\User Data\Default
It will overwrite the file and you have your bookmarks back. It takes about 10 minutes. No coding. No JASON to HTML conversion. Nothing.

My CSS file is not saving

I'm working on a web page project, with an HTML file and a CSS file only. I use Sublime Text 3 for a better programming environment, I also use XAMPP to debug my code and test it on Chrome.
When I'm saving my programming files, the HTML one is saving, but CSS one is not saving; I checked it in the directory and opened it to view if my editions are saved or no, they are, but they don't show up in the debug using XAMPP and Chrome.
Why aren't my changes showing up in debug?
Try deleting the Chrome Browser's Cache. It might be creating that problem
It doesn't let me comment, but this is adding onto the users answer of clearing the browser cache.
Clear browser cache in chrome: https://support.google.com/accounts/answer/32050?hl=en&co=GENIE.Platform%3DDesktop
If the issue resolves after clearing your browsing cache, what I usually do when working with stylesheets is use the Chrome browser in incognito mode, it usually doesn't store cache in that mode, so after closing the tab and revisiting, it should show all of the changes.
fisrt try to clear/delete your browsers cache and if that didnt work try the steps below.
Lets say all your css code is in a file called style.css, what you need to do is:
you can just change the name of your file to something else for example style2.css (dont forget to also change the name in html file)
or
create a new file for example new-style.css.
copy and paste all the css code that you have from style.css to
new-style.css.
and lastly just delete style.css.
after that you can rename new-style.css back to style.css Or you can
keep it like that. doesnt really matter as long as you remember to
change the link name in html as well.
It might not be the best way to solve this problem but it works.

Copy-Paste code from Sublime to PHP Storm went wrong

I'm new to html/css/js/php and i'm trying to create a site.I started working my html/css on a simple editor (Sublime-i know not the best idea),but in the meanwhile i started using PHP Storm. In order to get the pages i have made i copied the html content from Sublime and i pasted them in a new PHP file in PHP Storm (i did the same with the css). It turned out that transition went horrible and when i preview it is completely distrorted. Any ideas on what could have been so terribly wrong?
I had this issue before when I was trying to decide what to use sublime, phpstorm, and komodo edit. You need to copy the code across into a new .html or .php file. I can't recall which one does it but the file extension has something different that stops it.

How to integrate a json data frame into an html file

I'm currently "learning" d3js by myself and I found a lot of examples here. It seems that for all the visualizations we need two separated files. One is a script (an html file) and the other one is a json file which contains our data set.
I'm curious if there is a way to put the json file into html file so we can have only one file. I think I saw an example like this previously on the internet but I lost it.
The only reason I want to do it like this is that if data set is separated from html file, I cannot use Chrome to view my result (I think Chrome is blocking the script from reading local data set). I can use Firefox to open up my result but the animation doesn't perform smoothly.
Maybe some of my understanding is not really right. But if there is any suggestions please let me know. Thanks in advance.
If you're just using one HTML file, you probably have a <script> tag on your page where all the code is located. You can define your data as a Javascript array.
It can be nice to use multiple files to organize code, data, and view elements (the HTML). This page gives some help on setting your browser to let you do that. For Chrome, close all open windows. Then run Chrome from the 'Run' prompt with this flag: chrome --allow-file-access-from-files