Css and Js path not working in mvc4 published apllication - asp.net-mvc-4

In VS 2012 my project is running fine. But when I hosted it local IIS it does not find the css and js file.
In my project files are linked like
<link href="~/CSS/layout.css" rel="stylesheet" type="text/css" />
<link href="~/CSS/color.css" rel="stylesheet" type="text/css" />
and after hosting I get like
<link href="/ApplicationTemplate/CSS/color.css " rel="stylesheet" type="text/css" />
<link href="/ApplicationTemplate/CSS/bootstrap.css " rel="stylesheet" type="text/css"/>
I also tried to solve the problem to put css in #Url.Content() and scripts in #Scripts.Render(). But it did not work for me. Then somebody told me to change the published web config . But also did not work.

you should be using Url.Content() helper to avoid this type of issues. It generates url using the relative path and there will be no chance of issue like these.
<link href="#Url.Content("~/CSS/layout.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/CSS/color.css")" rel="stylesheet" type="text/css" />
Also make sure that CSS and Scripts folder is in root directory of project.
NOTE: Sometimes this also happens that in publish some css and js files are not published in the published folder so copy the css,scripts and js folder from your solution to published folder to make sure it.

Related

How to disable vue-cli adding [if IE] tags to my html output?

I'm in a vue-cli created project.
I have an icon reference in my public/index.html file which is intended for android phones.
<link rel="icon" sizes="192x192" href="/img/icons/touch-icon-192x192.png">
But after the application builds, the output is:
<!--[if IE]><link rel="icon" sizes="192x192" href="/img/icons/touch-icon-192x192.png"><![endif]-->
How do I prevent vue-cli, or the vue-pwa-plugin from adding any "if IE" tags to my output?

Can some know how to customize blazor components of matblazor?

I want to customize the input field textbox height more minimal and its font style. I used matblazor component to my project. Can someone know how I can solve this problem from root CSS or something like that?
Just include an additional CSS file in the _Host.cshtml like
...
<head>
...
<link rel="stylesheet" href="my-custom-matblazor-styles.css" />
</head>
or in your .razor file like this
<link rel="stylesheet" href="my-custom-matblazor-styles.css" />
to override the CSS rules of MatBlazor.
I would favor the latter as you need the CSS file only when you are actually using a MatBlazor component on a page.
Do not mangle with the original CSS files as it will result in a complete chaos when a new version of MatBlazor is released.

Cannot reach files (assets) inside assets folder in Laravel

I am new laravel. Recently I bought new laraval+bootstrap template from online. Now I am trying to serve project via artisan.
The project runs but template dont look as it was. I researched it and found out that it doesn't read css, javascript and other files from assets folder which is nearby public folder. Now i need help to read these files from assets folder.
The app folder structure is as below.
I slighly modified .htaccess file, but nothing changed
<link href="{{ asset('assets/plugins/chartist-js/chartist.min.css') }}" rel="stylesheet" type="text/css" />
<!-- Datepicker CSS -->
<link href="{{ asset('assets/plugins/datepicker/datepicker.min.css') }}" rel="stylesheet" type="text/css" />
Simply not reads files inside assets folder
These assets should not be within an assets folder in the root of your application.
Place assets within the public folder.
asset() helper links to the public directory of your application.

Bootstrap theme not displaying correctly at all

I am building a site based off of Bootstrap Carousel theme... unfortunately nothing is working when I copy the index and css file into my directory. Are there other files aside from the CSS that need to be in the same directory? like the glyphicons and all the buttons. It's literally just displaying the html... no carousel or anything.
nothing needs to be in same directory! just check you have the right path to the files! and all are loaded. As well as include the bootstrap links
Something like this :
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

apply stylesheet to web user control

I want to apply styles to one webusercontrol
I have tried with
<link rel="Stylesheet" type="text/css" href="<%=ResolveUrl("~/Styles/ascxStyles.css") %>" />
but i'm not able to apply styles to user control.
Thanks in advance
Try Something Like
href="~/Styles/StyleSheet.css"
where ~/ is Root directory of the application
and add runat="server"
Or just Drag Your css On your control it will automatically create appropriate path
I think your ResolveUrl is wrong. you can use this in your usercontrol or in that pages which uses this usercontrol :
<link rel="stylesheet" type="text/css" href="../Styles.css" media="screen" />
As far as I know, you can also use the css file
which you have added to your MasterPage.
So no need to add css file to Web User Control again.