I am in the process of developing a new web page where I want to implement my own CSS and incorporate some components from this source: . I'm facing an issue with one of the components, as the browser seems to be applying only the styles from my custom CSS file, ignoring the styles defined in the downloaded .css file from the source. Even though the class specified in the div tag is clearly defined in the external .css file, it's not being applied. Here's a snippet of the page source:
<div class="header">
<div class="right textHeader">
<div class="left logo"><p class="title">Portal para la gestión y control<br>
de la implementación del sistema de información PAI
</p>
</div>
<div class="right textInfo">
<div class="left greetTime">
<img src="/Content/Images/calendar.png"> 27/04/2013 12:15:25 p.m.
</div>
<div class="greet">
Hola, <a class="username" href="/Account/Manage" title="Manage">administrador</a>!
<form action="/Account/LogOff" id="logoutForm" method="post"><input name="__RequestVerificationToken" value="gsGgnTHMhT55z7aQFmarrbLlUQK4x2nuMNZP_kXbqRx2j3kWOhNSc3RptPzG8118PGgkQOpU_erRuCcZ7GvH4FhKNAlaCug0dFUGKjiFqbP5wjhFTJConDCIZzZppq090" type="hidden"> <a href="javascript:document.getElementById('logoutForm').submit()">Desconectarse</a>
</form> </div>
</div>
</div>
<div class="left imgHeader">
<img src="/Content/Images/logo-minSalud.png">
<img src="/Content/Images/logo-prosperidad.png">
</div>
</div>
<div id="categories">
<a href="/">Inicio</a>
</div>
<div id="content">
<h2>Bienvenido</h2>
This is the section where I am trying to apply the desired class
<a href="/Home/IndexSupportItems?Length=5" class="tile wide text">Administrar banco de información</a>**<a href="/Admin/ManageUsers">Administrar usuarios</a><a href="/Admin/ListReports">Reportes gerenciales</a>
</div>
Below is a screenshot from Firebug:
And here are screenshots indicating that both files are successfully downloaded: Here's the content of my customized CSS file:
// Custom CSS rules go here
/* Example: */
.myCustomClass {
color: #333;
background-color: #fff;
}
...
And here's the CSS file I downloaded from the source:
// External CSS rules retrieved from the source
/* Example: */
.bg-color-blue {
background-color: #0072BC !important;
}
...