Esri Dijit Claro.css theme is not read by web application

1085
0
07-31-2017 09:21 AM
TiffanySelvidge1
Occasional Contributor III

I am writing an application in asp.net in visual studio 2013 using c#, javascript and css. I am using esri javascript api and esri dijit themes.

The claro.css theme is not being read by the application. It is the only css with this problem. When I check in the web debugger inspector, the theme is not listed for the div anywhere in the inspect list. The two other esri dijits (popup.css and esri.css) are being read. My custom theme viewer.css is being read. I did have to put in an override for my viewer.css theme or else the esri.css kept reading over it. Without using override claro my custom css page will not be overridden by the esri.css . If I remove the override claro, the claro.css is still not read and the custom css is overridden by esri.css . Either way, the client does not see the claro.css.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
 <title>My Cool Map</title>
<%--Inside GIS Style Sources--%>
 <link rel="stylesheet" type="text/css" href="~/App_Themes/viewer.css" />
<%--Outside Style Sources--%>
 <link rel="stylesheet" type="text/css" media="screen" href="https://js.arcgis.com/3.4/js/dojo/dijit/themes/claro/claro.css" runat="server"/>
<link rel="stylesheet" type="text/css" href="https://js.arcgis.com/3.4/js/esri/dijit/css/Popup.css" /> 
 <link rel="stylesheet" type="text/css" href="https://js.arcgis.com/3.4/js/esri/css/esri.css" />
<script type="text/javascript" src="https://js.arcgis.com/3.4/"></script>
<script type="text/javascript" src="./Scripts/jquery.js">
</script>
 <script>
function Load(){
 map code
}
</script>
</head>
<body class="override claro">
 <div id="rightPane" dojotype="dijit.layout.ContentPane" region="right">
 <div dojoType="dijit.layout.AccordionContainer">
 <div dojoType="dijit.layout.ContentPane" id="legendPane" title="Legend" >
 <div id="legendDiv"></div>
 </div>
</body>
</html>
0 Kudos
0 Replies