1
votes

I've been tweaking some CSS where I'm changing the style of the anchor tags. That works fine. The thing that is confusing me is why something that is in a completely different div with a different class/ID would be affected by this styling?? (e.g. my little style adds styling to a little div block at the bottom of the page, but for some strange reason it started affecting the Admin nav bar up top) Btw, I'm working on a DotNetNuke skin.

Looking through the Inspect option in Chrome, it's like it's inheriting these styles, even though there should be no link to this style class I created!

I've checked my DIVs and they pair off correctly.

So I'm just wondering what else I can check to try and stop this from happening. I could be missing something very simple/obvious.

Thanks!

EDIT: Um yea obviously I should've included code ;) silly me!

Ok here is the CSS code that is affecting the skin:

#ehcbreadcrumbs {
    background-color: #BCBCBC;
    color: White;
    font-size: 1.1em;
    padding-top: 4px;
    padding-right: 0px;
    padding-bottom: 4px;
    padding-left: 10px;
    margin-top: 5px;
}
#ehcbreadcrumbs a, a:link {
    text-decoration: none;
    color: White;
    font-size: 1.1em;
}

#bottomnavbar {
    padding-top: 4px;
    padding-bottom: 4px;
    display: table;
}
#bottomnavbar ul {
    margin: 0 auto;
}
#bottomnavbar ul li {
    display: inline;
}
#bottomnavbar a, a:link {
    text-decoration: none;
}
#bottomnav a, a:link {
    font-size: 14px;
}

Here is the skin file:

<%@ Control language="vb" AutoEventWireup="false" Explicit="True" Inherits="DotNetNuke.UI.Skins.Skin" %>
<%@ Register TagPrefix="dnn" TagName="LANGUAGE" Src="~/Admin/Skins/Language.ascx" %>
<%@ Register TagPrefix="dnn" TagName="LOGO" Src="~/Admin/Skins/Logo.ascx" %>
<%@ Register TagPrefix="dnn" TagName="SEARCH" Src="~/Admin/Skins/Search.ascx" %>
<%@ Register TagPrefix="dnn" TagName="NAV" Src="~/Admin/Skins/Nav.ascx" %>
<%@ Register TagPrefix="dnn" TagName="TEXT" Src="~/Admin/Skins/Text.ascx" %>
<%@ Register TagPrefix="dnn" TagName="BREADCRUMB" Src="~/Admin/Skins/BreadCrumb.ascx" %>
<%@ Register TagPrefix="dnn" TagName="USER" Src="~/Admin/Skins/User.ascx" %>
<%@ Register TagPrefix="dnn" TagName="LOGIN" Src="~/Admin/Skins/Login.ascx" %>
<%@ Register TagPrefix="dnn" TagName="LINKS" Src="~/Admin/Skins/Links.ascx" %>
<%@ Register TagPrefix="dnn" TagName="PRIVACY" Src="~/Admin/Skins/Privacy.ascx" %>
<%@ Register TagPrefix="dnn" TagName="TERMS" Src="~/Admin/Skins/Terms.ascx" %>
<%@ Register TagPrefix="dnn" TagName="COPYRIGHT" Src="~/Admin/Skins/Copyright.ascx" %>
<%@ Register TagPrefix="dnn" TagName="STYLES" Src="~/Admin/Skins/Styles.ascx" %>
<%@ Register TagPrefix="dnn" TagName="MENU" Src="~/DesktopModules/Infinity.Menu/ViewMenu.ascx" %>


<%@ Register TagPrefix="snapsis" Namespace="Snapsis.DNN.Skins" Assembly="Snapsis.DNN.NavMenu" %>
<%@ Register TagPrefix="ddr" TagName="DDRMENU" src="~/DesktopModules/DDRMenu/Menu.ascx" %>
<%@ Register TagPrefix="ddr" Namespace="DotNetNuke.Web.DDRMenu.TemplateEngine" Assembly="DotNetNuke.Web.DDRMenu" %>


<%@ Register TagPrefix="google" TagName="FOOTER" Src="Footer.ascx" %>



<script src="<%= Page.ResolveUrl("Portals/_default/Skins/ehc2011/js/common.js") %>" type="text/javascript"></script>


<div class="cpanel_right">
    <div class="cpanel_left">
         <div runat="server" id="ControlPanel"></div>
    </div>
</div>
<div class="clear"></div>

<div class="wrapper">
    <div class="layout">
        <!--Head Start-->
        <div class="BCKhead">
            <div class="logo"><dnn:LOGO runat="server" id="LOGO1"  />
                <h1 class="hideFromView">XXXXXX</h1>
                <h2 class="hideFromView">XXXXXXX</h2>
            </div>
            <div class="top">
                <div class="topmenu">
                    <ul>
                    <li class="last"><a href="/TheXXXXpilot/Deliveringtheproject/Theprojectteam/tabid/66/language/en-AU/Default.aspx" title="Contact Us">Contact Us</a></li>
                    <li><a href="/TheXXXXpilotprogram/FrequentlyAskedQuestions/tabid/137/language/en-US/Default.aspx" title="View the FAQ">FAQ</a></li>   
                    <li><a href="/UsetheXXXX/tabid/155/language/en-US/Default.aspx" title="Use the XXXX">Use the XXXX</a></li>
                    </ul>
                    <div class="clear"></div>
                </div>

                <div class="accessibility">
                <a href="javascript:changeFontSize(-1)" title="Decrease font size"><img src="<%= Page.ResolveUrl("Portals/_default/Skins/ehc2011/images/resizesmall.gif") %>"  alt="Decrease font size"/></a>&nbsp;<a href="javascript:changeFontSize(1)" title="Increase font size"><img src="<%= Page.ResolveUrl("Portals/_default/Skins/ehc2011/images/resizelarge.gif") %>"  alt="Increase font size"/></a>
                </div>

                <div class="searchbox">
                    <div style="display:none"></div>
                    <div id="dnn_dnnSEARCH_DropDownSearch">
                        <dnn:SEARCH ShowWeb="false" ShowSite="false" UseDropDownList="false"  Submit="Search" runat="server" ID="dnnSearch2"  CssClass="searchbox"/>
                    </div>
                </div>                
            </div>
            <div class="clear"></div>
        </div>
        <!--Head End-->
        <!--Container Start-->
        <div class="container_inner" id="container_inner">
            <div class="leftcontent">
                <div class="mainmenu innerHeight">

                     <Snapsis:NavMenu id="LeftNav"  CacheTabs="false" Level="0-2" Type="Hover" 
                     OnlyExpandActive="false" ShowType="Always"
                      EnableViewState="true" 
                      runat="server" ExcludeTabs="Admin,Host" /> 
                    <div class="clear"></div>
                </div>
                <div style="height:5px; overflow:hidden; background:#fff;" id="WhiteDiv"></div>
                <div id="LeftPane" runat="server" class="LeftPane"></div>
            </div>
            <div class="rightcontent">
               <div class="banner"><a href="/UsetheXXXX/tabid/155/language/en-US/Default.aspx" ><img src="<%= Page.ResolveUrl("Portals/_default/Skins/BCKGraphic/images/inner_banner.jpg") %>" /></a></div>
               <div class="RightDiv">
               <div id="ehcbreadcrumbs">
                <dnn:TEXT runat="server" id="dnnTEXT" Text="You are here >" ResourceKey="Breadcrumb" /> <dnn:BREADCRUMB ID="dnnBREADCRUMB" RootLevel="0" Separator="&nbsp;>&nbsp;" runat="server" />
               </div>
               <div id="RightPane" runat="server" class="RightPane"></div>
               </div>
            </div>
            <div class="clear"></div>
            <div id="ContentPane" runat="server" class="ContentPane"></div>
            <div class="clear"></div>
        </div>
        <div class="clear"></div>

        <div class="clear"></div>                
        <!--Container End-->
        <div class="bottomcontent"></div>
        <div id="bottomnavbar">
            <ddr:DDRMENU MenuStyle="sitemap" NodeSelector="RootOnly" runat="server" ></ddr:DDRMENU>
         </div> 
    </div>
</div>

<!--Foot Start-->
<div class="footer">
    <div class="footer_con">
        <div>footer text</div>
        <div class="clear"></div>
    </div>
</div>

<% If DotNetNuke.Security.PortalSecurity.IsInRoles("Administrators") Then%>
<div class="copyright"> 
Logged in as <dnn:USER runat="server" id="dnnUSER"  CssClass="user" /> | 
<dnn:LOGIN runat="server" id="dnnLOGIN2" CssClass="copyright" Text="Login" />
</div>                      
<%End If%>

<!--Foot End-->

<dnn:STYLES runat="server" id="StylesIE6"  Name="IE6Minus" StyleSheet="css/ie6skin.css" Condition="LT IE 7" UseSkinPath="true" />

<script type="text/javascript" >
if(dnn_LeftPane.className.indexOf("DNNEmptyPane") != -1)
{
    if(dnn_ContentPane.className.indexOf("DNNEmptyPane") == -1)
    {
        document.getElementById("WhiteDiv").style.display = "none";
        document.getElementById("container_inner").className = "container_inner_setting";
    }
}
else
{
      document.getElementById("WhiteDiv").style.display = "";
      document.getElementById("container_inner").className = "container_inner";
}
</script>

<google:FOOTER id="footer1" runat="Server"></google:FOOTER>

So the style in bottomnavbar/bottomcontent seems to affect some aspects of the DNN Admin bar (ControlPanel). it also affects the logged in user part if I change the font size in bottomnavbar, the font size within the "copyright" block anchhor bits change size too. It's confusing the heck out of me why, as the DIV blocks (to me) look properly paired off.
And yes I'm aware it's not very pretty ;) (skin was originally created by someone else, I've taken over to make changes to it)

1
It is impossible to tell if you don't post any CSS or HTML in your question. Edit it, and paste in the relevant HTML and CSS.Bojangles
All we can really do is speculate about what might be wrong until we can get our hands on some of your code.Aaron

1 Answers

2
votes

Your problem is the COMMAs

#ehcbreadcrumbs a, a:link {

should really be

#ehcbreadcrumbs a, #ehcbreadcrumbs a:link {

same thing for

#bottomnavbar a, a:link {

should be

#bottomnavbar a, #bottomnavbar a:link {

etc