Design mode in Visual Studio doesn't ger resources specified with ResolveClientUrl - asp.net

I use ResolveClientUrl to include css files in my page. When launched through web-server everything is OK, but in design mode css styles are not applied to the page. I use VS 2010 beta 2.
<link href= "<%= ResolveClientUrl("~/Styles/Site.css") %>" rel="stylesheet" type="text/css" />
Same thing happens when I use any expression to specify an url for css.
How can I fix it? Or is it a bug of beta?

It's an inherent limitation of both. I contacted microsoft 3 years ago about the exact same issue.
The solution is to put the path directly inside the href attribute. It should work properly then.
It may, however, malfunction at runtime, depending upon your use of URL rewriting or routing.
The real bug here isn't in the design mode, but in the ASP.NET framework, because it doesn't parse and resolve <link> tags properly when they are used inside content pages (dig around with Reflector to find out for yourself)...
You can read more about the issue and how to fix it in a (hopefully) future-proof manner here:
http://nathanaeljones.com/146/referencing-stylesheets-scripts-from-content-pages/

Related

How should I declare my namespace for angularJS ui-router so it's valid in html and VS 2013?

In my index.html I have defined the following:
<html class="dark"
ng-app="app"
ng-controller="appController"
id="ng-app"
xmlns:ng="http://angularjs.org"
ng-app="optionalModuleName">
In my code I have:
<a ui-sref="home.content({ content: 'overview' })"
ui-sref-active="current">
From what I understand the xmlns:ng="http://angularjs.org is required by some versions of IE
to identify the different namespaces.
Now I am also using ui-router. So how should I declare the namespace?
I assume xmlns:ui but what should I put after that ?
Also in VS2013 it's coming up as invalid. Is there a way I can tell VS2013 to ignore ui- that it sees in HTML ?
Just to be clear in the first place - you are naming your index site index.html. This confused me a little since namespaces are only valid, when used in xml documents. For html it would be the xml application xhtml. If you do not know the difference, please read it up on the web. There are many good tutorials and articles explaining the differences between htmland xhtml.
Back to your question: As far as I can see from their source code, the ui router is developed in valid angularjs, and the usage is like the usage of angular directives, so you should be fine only including the angularjs namespace to your root element.
Please also read the following document for further introductions on how to make angularjs compatible with Internet Explorer: https://docs.angularjs.org/guide/ie
As for your second question, I don't know if you can setup VS2013 to ignore certain attributes, but since html5 you are able to add data- before them to make them valid (x)html.
As described in here: https://docs.angularjs.org/guide/directive
and here: http://www.w3schools.com/tags/att_global_data.asp
So for example:
<a data-ui-sref="home.content({ content: 'overview' })"
data-ui-sref-active="current">

css intellisense not firing for class attribute in MVC 4 (VS12 Update 3, VS13 Preview)

I have googled a lot to try to find a fix for this. But none of the discussion is helping me. Here is my situation.
For him in this question. He says that css intellisense is working if he adds css like below. I am already using this method.
<link href="~/Content/style.css" rel="stylesheet" />
adding type="text/css" is also not working. I usually do not use this attribute but tried adding this when I saw in this question.
I also have both of these tools installed Web Essential 2012 and Microsoft Web Developer Tools extension.
Besides that, intellisense is working everywhere perfectly. It is also generating intellisense for HTML element, Razor expressions and even for JavaScript (jQuery too).
In the image below, there is no intellisense at current cursor location.
Please help me getting rid of this.
Added:
It won't generate list of css classes even if I add a few css classes in <style></style section.

Shopify: Can't load external stylesheet from another server

https://friends-with-you.myshopify.com/
I'm trying to develop my first shopify theme. I'm trying to load a stylesheet which is hosted on another server, but the CSS is not loading. If I copy and paste that CSS directly into a file in the shopify theme, it works.
<link type="text/css" rel="stylesheet" href="http://fwy.pagodabox.com/magic/themes/fwy/fwy.css" />
What am I doing wrong at the above URL, and why isn't the css loading?
thanks!
Can you load your CSS file over both http and https? If so, change your tag to look like this:
<link type="text/css" rel="stylesheet" href="//fwy.pagodabox.com/magic/themes/fwy/fwy.css" />
That way whether a user visits using http://yourstore.com or https://yourstore.com, they'll get the stylesheet served using the protocol they're on (and you won't get any mixed content warnings).
A little more background: http://paulirish.com/2010/the-protocol-relative-url/
Under IE7 and IE8, using this in a <link> tag will result in your content being fetched twice.
Change your link tag to use a secure URL:
<link type="text/css" rel="stylesheet" href="https://fwy.pagodabox.com/magic/themes/fwy/fwy.css" />
^
The URL you're using now works fine on its own, but since you're browsing to the Shopify store over SSL, many web browsers are going to be hesitant to load the CSS over an unsecured connection.
I just checked and pagodabox serves the CSS file just fine over SSL.
In normal HTML documents one can load stylesheets from anywhere, as long as they exist and you're able to load them by typing the URL in (which I can).
I see the page as two navigation bars with a logo on the left hand side. There are hover states with transitions to a colour background on each item. Although, when I loaded the page, Chrome warned me not to load supposedly insecure content. Before this is loaded I just see text in Times New Roman. I think this is you problem.
I use themes with WordPress and style-sheets come with them (mostly). I don't see why you couldn't just put the style-sheet in with the rest of the theme.
Overall, the answer is yes (normally) but in this case browsers may regard it as un-safe and therefore not load it.
Yes you can! But it is faster to host the stylesheet on your server/where the other files reside. If you plan to include a stylesheet from elsewhere, you could run into problems of that server being down/busy and hence your theme will not display as required. As #Blieque mentioned, some browsers may question external content causing unnecessary warning popups to a user/user-agent.

Visual Studio's CSS Intellisense - Absolute paths & MasterPage files

I've noticed that to get CSS-Intellisense working in VS, the paths have to be relative - Is this the case?
However, it seems
<link href="/resources/test.css" [...] />
is far more practical than
<link href="resources/test.css" [...] />
I'm including the CSS in the master page, and don't see much good in including it as a content block, just to get the relative paths correct for each directory depth. I've had a quick try with inline code resolving the path, but no dice there either (for Intellisense).
I feel I'm missing something fairly simple - What's the correct approach here to have CSS Intellisense work across the pages in the app during dev, and render fine in any deployed state?
Cheers.
(Note - I'm aware that a <% if (false) { %> type hack is required for user controls)
I know this is an older question, but this works fine in VS2008. If my memory serves me correctly it was fixed in a hotfix a while back:
alt text http://img168.imageshack.us/img168/8893/testgo.png
The other alternative ( if this isn't working for you still ) is adding a runat="server" and the tilde "~"
<link rel="stylesheet" runat="server" media="screen" href="~/css/styles.css" />
This worked for me. YMMV

How do tools like the web dev toolbar get the entire css file of a site?

The web dev toolbar for Firefox is quite an impressive tool.
What I am completely clueless about is how does this tool get the css stylesheet file of a site? This is hosted on a host which is secure etc. I am completely stumped.
I must be thinking about this in all the wrong way.
Thanks
The client (in this case Firefox) has to download the CSS file in order to render the page correctly. The plugin (in this case Firebug) simply requests the proper URL and the browser it gets it--most likely from the cache. There is no real mystery here.
In every HTML file, there's a link to the CSS stylesheet, or else the browser wouldn't know where to find it, thus losing the ability to render the page correctly.
It's in the form of <link rel="stylesheet" type="text/css" href="theme.css">,
I'd like to add that regardless of whether the host is 'secure' or not, it still is presenting the file to the client.
Unless, of course, you're looking at a XML file. Then you need to consult the XSL which'll tell you where the stylesheet is.

Resources