Hello all, i am facing a very peculiar problem, maybe i am wrong i dont know. Here is my problem,i have a masterpage and a nested masterpage that inherits from the masterpage. All the Content pages inherits the nested masterpage. I have a stylesheet file(clientstyle.css) that is placed in the masterpage and is used for all the underlying pages. The problem i am facing is that elements(tags) h1,h2,h3,h4 defined for a particular class is not recognized...instead the style of a different class is applied to it. Actually, i had couple of css files, but later for convinience i merged all of them into one and placed it into the masterpage file. Everything works but just the heading tags...here is the perpetrator
.PanelSmallStyle1
{
height: 160px;
width: 200px;
margin: 0;
padding: 0;
background-color: White;
}
.PanelSmallStyle1 h1,h2,h3,h4
{
margin: 0;
padding: 5px;
background-color: Blue;
color: White;
height: 30px;
text-align: center;
}
.PanelSmallStyle1 img
{
margin: 0;
padding: 0;
height: 130px;
width: 100%;
}
this class is applied to the markup when i clearly stated that i want to apply the following...
.NestedWrapper
{
margin :0px;
padding :0px;
}
.NestedWrapper h1,h2,h3,h4
{
text-decoration: underline;
color: #4b18a7;
text-align: center;
}
.NestedWrapper p,ul,hr
{
color: #464444;
font-family: arvo,serif;
text-align: justify;
}
And the markup where i want to apply the class is...
<div class="NestedWrapper">
<h2>Plan Your Travel</h2>
<asp:Image ID="dfdfdf" ImageUrl="~/Images/Plan-Your-Travel/dfsdf.gif"
runat="server" /><br />
<cc1:TabContainer ID="TabContainer1" runat="server".........
No matter what i do the h2 tag always takes the .PanelSmallstyle1 classes h1,h2...definition...i inspected the elements in google and in firefox...i know there are work arounds for this but i want to know the reason why this is not working...am i lacking knowledge in css??....and FYI i have double checked everything...there are no conflicting classes within the file...moreover in the inspect element feature of the browser, the panelsmallstyle1 class is shown as the matching css rule??...and the class nestedwrapper is at the bottom. the definition should not be able to overwrite the nestedwrapper class right??