Styles are not working for Content page asp.net - asp.net

I'm facing a problem when our application is deployed in IIS. The styles are not applying to the content page but everything was working fine when I was running it through VS 2010.
This is what I have given in the master page.
<link href="Styles/style.css" rel="stylesheet" type="text/css" />
The above code which I have specified will apply only for the Home page which is in the root directory but when I navigate to so other module styles are not applying to those page which are inside other folder.
I searched in Google and I tried many options like
<link href="./Styles/style.css" rel="stylesheet" type="text/css" />
<link href="../Styles/style.css" rel="stylesheet" type="text/css" />
<link href="~/Styles/style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
#import 'Styles/style.css'; </style>
None of the above things are working even for home page also which used to work before. Please let me know some suggestions so I can proceed further.

<head runat="server">
<link href="~/Styles/style.css" rel="stylesheet" type="text/css" />
</head>
it will work and load your css on every page

try with adding the root/domain in a dynamic way before the styles folder in ur code.

Related

CSS files loading but CSS not being applied

I have an ASP.NET MVC project using Boostrap 4 and jQuery DataTables. For both tools, the CSS files load but none of the CSS rules are applied. Looking at the network tab of Chrome dev tools, content type is coming over as text/css. Here's the code within the head tag of the main layout page:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
#*<link href="#Url.Content("~/Content/bootstrap.css")" rel="stylesheet" type="text/css" />*#
<link href="#Url.Content("~/Content/Site.css")"rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/pushy.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/MyStyle.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/themes/base/jquery-ui.min.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/font-awesome.min.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/themes/base/theme.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/DataTables/css/jquery.dataTables.min.css")" rel="stylesheet" type="text/css" />
#*<link rel="stylesheet" type="text/css" href="#Url.Content("~/Content/DataTables/css/dataTables.bootstrap.min.css")" />*#
<link href="#Url.Content("~/Content/DataTables/css/dataTables.bootstrap4.min.css")" rel="stylesheet" type="text/css" />
I've tried using runat="server" in both the link and head tags, using #Styles.Render instead of a link tag, swapping out the minified file with the full one, href with and without #Url.Content(), and using a file directly from Bootstrap, all with no success (haven't been able to find any other solutions on SO either).
MyStyle.css loads and applies properly, but not the Bootstrap or DataTables CSS. This is driving me nuts trying to figure out the issue - what am I missing?
I'm running .NET 4.6.1 on Visual Studio 2017.
Actually another css file from _Layout.cshtml overwrites the view page css file.removed main.css from Viewpage.cshtml

Bootstrap not working when deploying a Ruby on Rails App

I have placed bootstrap.min.css and bootstrap.min.js in assets/stylesheets and assets/javascripts, respectively. When I run my app locally, I get the styling that I expect. Further, if I view the source locally I see the following tags:
<link rel="stylesheet" media="all" href="/assets/comments.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="true" />
(there are many other tags like this one)
I have the same setup on a DigitalOcean Droplet, but the css and javascript doesn't seem to be working.
If I view the source on the server I see tags like this:
<link rel="stylesheet" media="all" href="/stylesheets/application.css" data-turbolinks-track="true" />
<link rel="stylesheet" media="all" href="/stylesheets/bootstrap.min.css" data-turbolinks-track="true" />
Something doesn't seem to be rendering properly. This is probably my lack of experience showing, but I really have no idea how to proceed here.
Any ideas?

CSS not loading in FF. Different than others issues

One of my stylesheets doesn't seem to load every style. I've read everything i can find but the issues that people usually have are obvious things to me but i can't seem to figure out my own issue. I have a site made using Razor and this is where i call my stylesheets in the head section.
<link href="#Url.Content("~/css/reset.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/css/jquery-ui-1.10.1.custom.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/css/searchLayout.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/css/searchSkin.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/css/skin.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/css/AvailabilityLayout.css")" rel="stylesheet" type="text/css" media="screen" />
<link href="#Url.Content("~/css/AvailabilitySkin.css")" rel="stylesheet" type="text/css" media="screen"/>
<link href="#Url.Content("~/css/Home.css")" rel="stylesheet" type="text/css" />
The issue seems to be with the AVailabilitySkin.css and sometimes AvailabilityLayout.css. So for example i have this code in AvailibilitySkin.css:
td#price h2, td#price h4
{
text-align:center;
}
And it doesn't get picked up, I don't even see it being overwritten by another style or anything. But if I add the same code to the Skin.css file then it works perfectly fine. I can't add all my styles to Skin.css so i can't just put that style in there and call it a day. It has to be separated, right now the site is being developed locally so unfortunately i cannot post a link to the site but if anything is needed (like more code) please let me know. I haven't been able to find the issue and I've tried adding #charset "UTF-8"; at the top of the stylesheets and it didn't really do much.
Problem has been fixed guys/gals. In the end it was just another mistake by me and it wasn't coming up in the Console and Visual Studio wasn't flagging it as an issue. It was mostly just a missed single quote and another programmer here ran the code through WebStorm and it came right up and fixed it. Thanks for the help and sorry for the dumb mistake question.

How to serve css files in djangos's flatpages?

I'm building a basic site and thought of using the flatpages app for a couple of pages. Problem is, I'm not sure how to serve static files in my flatpages.
The link in my flatpage template is this:
<link type="text/css" rel="stylesheet" href="static/base.css" />
However, firebug shows that file is being looked at:
localhost:8000/example_flatpage/static/base.css
instead of
localhost:8000/static/base.css
Infact, every link in the template works this way.
Instead of
localhost:8000/home/
localhost:8000/example_flatpage/home/
Here's my default flatpage template:
<html><head>
<title>title</title>
<link type="image/x-icon" rel="icon" href="static/favicon.ico" />
<link type="text/css" rel="stylesheet" href="static/base.css" />
</head>
<body>
mainly plain text
</body>
</html>
Any ideas??
Use "/static/base.css" instead of "static/base.css". The first one is a path relative to root '/', while the second form is a path relative to the current page.

Why my nested master page loses CSS formatting?

My website structure is as follows
/Style.css
/MasterPage.Master
/Default.aspx
/Member/
member.master
member.aspx
The /MasterPage.Master points to style.css as follows
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
and it works like a charm.
After adding the member.master as a nested master page of MasterPage.Master i noticed that both the VS2010 and the rendered webpage, could not apply the formatting at the child member.master
After some googling i found that i could use the following code
<link rel="stylesheet" href="<%= ResolveUrl("style.css") %>" type="text/css" media="all"/>
The webpage is rendered correctly now, but how can i have the same result in design mode with the visual studio?
As I see, all paths should go as relative paths.
If you have the style sheet as
<link href="~/Style.css" rel="stylesheet" type="text/css" />
the pages should work well. At the same time you need to have master pages referred as:
In your member.master:
MasterPageFile="~/Site.master"
In member.aspx:
MasterPageFile="~/Member/member.master"
Hope this will help you.

Resources