Why is visual web developer working the way it is

Question

I've written down exactly what I've done:

Visual web developer – new project - New web application

Double click "Site.Master" in solution explorer.

Click "design"

Select the text: "My ASP.NET Application"

Format – font - change color - (not showing change. Opening font again shows the old font color.) Why?

Click on "<h1.style1>" at bottom

Format – font - change color – (this time it works fine)

Click to the right of "My ASP.NET Application" – div.loginDisplay is selected. Why? Why not the whole header?

Change background color - "My ASP.NET Application" disappears. Why? <- My main question.

Start debugging – "My ASP.NET Application" is shown. Why (since it wasn't showing in visual web developer)?

Answer 1

Honestly, I find the embedded "Design" mode of VSWD to be extremely buggy and certainly not reliable. I don't think you can find a fix for that, because... I believe it wasn't intended to reflect 1:1 state of the webpage, but instead just to show developers just a hint, how it may look like. If you look at video tutorials made by people from Microsoft (Joe Stagner etc.), they all use a real web browser to debug their apps, not a design tab.

So, my advice would be not to rely on a Design tab and use VS like a developer's tool, not some wysiwyg editor.

Answer 2

My suggestion, if you want to get good at web development, remove Design mode from Visual Studio.

Go to:

Tools > Options > HTML Designer

Then untick Enable HTML designer

---

Try and get used to only reading the code, and not relying on Visual Studio adding the code for you (badly).