I have a HTML file where the formatting is completely messed up. Hopefully you can the the problem in this picture below:
This is just an example from the file (other parts are messed up too). You can see that the <table> start tag and end tag don't have the same indentation. Also, I would expect everything inside the tag to be indented farther. This is how it looks after using the Shift + Alt + F code formatting shortcut. What could the problem be and how can I solve it?
I had the same problem! I opened a issue in vscode's github https://github.com/microsoft/vscode/issues/74139#issuecomment-495578264. The older versions used to work I just got it solved rolling back to the version 1.17...
Related
VS had suddenly stopped recognizing HTML files and it doesn't autocomplete tags or even show the syntax unless I manually input every single file name in it, I would really appreciate the help on any idea how to solve that Here is how it looks:
I have tried many things but nothing seems to work or help fix it
See if this solves the problem:
On the bottom right of the application, you should see something like this:
Click on the "Plain text".
Search HTML in the list and click it.
Then your HTML should turn colorful.
When I save my file, a block of code gets messed up and end up being indented to the right.
Here is a screenshot to demonstrate the problem:
The code works but it's just not visually pleasant.
I have tried to uninstall some extensions, but none of them had to do with HTML.
Fixed by removing the extra " from line 645 to 647 that was causing the right indention.
For Visual Studio Code, you can use the hotkeys to reformat your code. The following hotkeys is for formatting your document, it works for html and other kinds of files as well, such as javascript files, json files, etc.
Format Document
Note: Different computer may have different settings. To search for hotkeys, ctrl + shift + P.
Why not try "save as" and give the file a new name. It might just save the changes the way you want it to.
I have a Wordpress site and created a custom theme for it. The pure CSS and HTML test version (without making it an actual Wordpress theme) is displayed 100% correct.
As soon as I make it dynamic and create a WP theme, IE 10 is ok, but IE10 compatibility and below somehow evaluate my document head as part of the body. It is displayed in IE html view window like this:
'!!!' is my actual title. All the CSS and meta information should be before my title, and somehow the head ending metatag is not displayed but it is present in my html markup.
SourceCode view is displayed as:
Head ending and everything in place. However there are two leading whitespace before DOCTYPE declaration, I have no idea how they got there, cleaned up every possible place in my source files. If I copy and paste their value into notepad two question marks "??" are displayed instead of whitespace.
Have never seen anything like this before. Mozilla and Chrome are 100% ok.
In case anybody has the same problem I found the answer.
My page.php and functions.php file of the Wordpress theme was utf-8 encoded that sometimes puts leading whitespace in the source code. This was enough for IE. I made it ANSI encoded and now it is ok.
Check out http://cancerpreventionnetwork.org/participants.shtml and you can see that the header is dropped down on this page. If you click on any other page, the header is not dropped like that. I have tried everything and I can't figure out what is causing this.
When I check the page in Chrome with inspect element, I see an extra text node. I can't see it in the source, but maybe you can?
seems to me that it's the classic UTF8 BOM encoding problem
you need to check all your source files and make sure that they are not encoded using the BOM.
there are many ways to remove it. I use notepad++ but there might be an automated tool or some shell code to remove the BOM for multiple files
and also.. if you're including files (templates) make sure that they don't have white spaces or new lines after the ?>
Good Luck
I have a file with a lot of this kind of thing in it:
<asp:TableCell ID="TableCell9" runat="server">Company
Organization:</asp:TableCell><asp:TableCell ID="TableCell10" runat="server">
How can I get the formatter to change it to shows like this:
<asp:TableCell ID="TableCell9" runat="server">Company Organization:</asp:TableCell>
<asp:TableCell ID="TableCell10" runat="server">
What I have tried:
I opened Tools->Options then browsed to Text Editor. I got a list of Languages. I selected HTML because that is the language that controls formatting for aspx files.
I changed "tag wrapping" to not have "Wrap tags when exceeding specified length" checked.
I then pressed ctrl+k, ctrl+d (Format the document). This did not fix the problem.
What I don't want to have to do:
Edit the file manually to fix all the tags.
Any ideas?
I was having the same problem, and I found the answer on Scott Gu's blog.
The solution is to setup the formatting rules in Visual Studio (right click on any tag, click on Formatting and Validation, click on Tag Specific Options)
When press ctrl-k, ctrl-d the document will format as per your settings. If a closing tag does not move to a new line, it's because there is no space between the end tag and what is preceding it. This happens because Visual Studio is being careful to not change how the page is rendered.
For the full blog post checkout Scott Gu's blog post.
http://weblogs.asp.net/scottgu/archive/2006/07/07/Tip_2F00_Trick_3A00_-Custom-formatting-HTML-in-Visual-Web-Developer-and-Visual-Studio-2005.aspx
I found a way that works.
In the list with HTML there is a File Extension Option.
I added ASPX to that list and said to edit it with an XML editor (I suppose I could have just right clicked it and opened it with the xml editor, but I did not think of that till after).
Anyway, once it is open as an XML File I formatted it (ctrl+k, ctrl+d) and it formated the way I wanted it. I then removed the extension mapping and reopend the file again.
One last formatting adjusted the tab spacing and I was perfect!
Note: When I did this the top line had this change made: from Page Language="C#" to Page="" Language="C#" I changed it back manually and all seemed to be well.
Later Note: Sadly, Visual Studio messes up the formatting every time I run the solution. Note that pressing ctrl+k, ctrl+d is fine and keeps my nice formatting, but when I run, Visual Studio collapses it down to a very unreadable format. :( Don't know how to fix it....
The answer should be:
Tools-Options->Text Editor->HTML-Format->Tag Specific Options
Then in ASP.NET Controls look for your tag. If it's not there you might need to Add it (New Tag) and set the Line breaks as you want them.
However I've found that this does not always work.Visual Studio respects the per tag colorization but Line breaks are not always respected.
So if this doesn't work for you, you might need to do a Search-Replace hack (Look for and replace with a NewLine in the middle), thenk try Format document and that should work.