تحتاج إلى مساعدة في بلدي CSS على بلدي دوتنت الجلد

StackOverflow https://stackoverflow.com/questions/813051

سؤال

ولقد خلق الجلد لدوتنت 5.x و حاولت أن تفعل أكبر قدر من التخطيط باستخدام المغلق ما استطعت. بلدي المسألة هي الاتساق بين IE و FF / كروم / سفاري. مع معظم المواقع أنا قادرة على التغلب على هذا، ولكن في هذا الجلد لقد حاولت كل شيء كنت أفكر فيه وقضى الكثير الكثير من ساعات في محاولة للحصول على مظهر متناسق بين البلدين. عندما حل واحد، فإن البعض كسر. أيمكن لأي شخص أن يساعدني لحل هذه المشكلة؟ يرجى إلقاء نظرة على الجلد هنا في كل من IE و FF لمعرفة الفرق:

http://bluebookbasement.coultertechnologies.com

وBlueBookBasement_full.ascx 

    <%@ Control language="vb" CodeBehind="~/admin/Skins/skin.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" %>


<div id="ControlPanel" runat="server" />
<div id="mainbody">
    <div id="container">
        <div id="top_banner">
            <div style="float:left; "><dnn:LOGO runat="server" id="dnnLOGO"  /></div>
            <div id="top_banner_right">  </div>
        </div>
        <div id="content">
            <div id="content_top_left">
                <div id="content_top_right">
                    <div id="top_nav">
                        <div id="nav_left">
                            <div id="nav_right">
                                <div id="nav_main">
                                    <dnn:NAV 
                                        runat="server" 
                                        id="dnnNAV"  
                                        ProviderName="DNNMenuNavigationProvider" 
                                        IndicateChildren="false" 
                                        ControlOrientation="Horizontal" 
                                        CSSNodeRoot="main_dnnmenu_rootitem" 
                                        CSSNodeHoverRoot="main_dnnmenu_rootitem_hover" 
                                        CSSNodeSelectedRoot="main_dnnmenu_rootitem_selected" 
                                        CSSBreadCrumbRoot="main_dnnmenu_rootitem_selected" 
                                        CSSContainerSub="main_dnnmenu_submenu" 
                                        CSSNodeHoverSub="main_dnnmenu_itemhover" 
                                        CSSNodeSelectedSub="main_dnnmenu_itemselected" 
                                        CSSContainerRoot="main_dnnmenu_container" 
                                        CSSControl="main_dnnmenu_bar" 
                                        CSSBreak="main_dnnmenu_break" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="middle_left">
                <div id="middle_right">
                    <div id="indent_left">
                        <div id="indent_right">

                                <div id="breadcrumbs">
                                    <dnn:TEXT runat="server" id="dnnTEXT"  CssClass="breadcrumb_text" Text="You are here >" ResourceKey="Breadcrumb" />&nbsp;
                                    <dnn:BREADCRUMB runat="server" id="dnnBREADCRUMB"  CssClass="Breadcrumb" RootLevel="0" Separator="&nbsp;>&nbsp;" />
                                </div>
                                <div id="BannerPane" class="BannerPane" runat="server"></div>
                                <div id="TopPane" class="TopPane" runat="server"></div>
                                <table border="0" cellpadding="0" cellspacing="0" width="100%" >
                                    <tr>
                                        <td class="leftpane" id="LeftPane" runat="server" valign="top"></td>
                                        <td class="contentpane" id="ContentPane" runat="server" valign="top"></td>
                                        <td class="rightpane" id="RightPane" runat="server" valign="top"></td>
                                    </tr>
                                    <tr>
                                        <td colspan="3">
                                            <table border="0" cellpadding="0" cellspacing="0" width="100%" >
                                                <tr>
                                                    <td class="mid3" id="Mid1Pane" runat="server" valign="top"></td>
                                                    <td class="mid3" id="Mid2Pane" runat="server" valign="top"></td>
                                                    <td class="mid3" id="Mid3Pane" runat="server" valign="top"></td>
                                                </tr>
                                            </table>
                                        </td>

                                    </tr>
                                    <tr>
                                        <td class="leftcontentpane" id="LeftContentPane" runat="server" valign="top" colspan="2"></td>
                                        <td class="rightpane" id="RightSidePane" runat="server" valign="top"></td>

                                    </tr>
                                    <tr>
                                        <td class="leftpane" id="LeftSidePane" runat="server" valign="top"></td>
                                        <td class="rightcontentpane" id="RightContentPane" runat="server" valign="top" colspan="2"></td>

                                    </tr>
                                </table>
                                <div id="BottomPane" class="BottomPane" runat="server"></div>
                                <div class="clear"></div>

                        </div>
                    </div>
                </div>
            </div>            
            <div id="content_bottom">
                <div id="content_bottom_left">
                    <div id="content_bottom_right">
                        <div id="content_bottom_middle">
                            <div id="prefooter">
                                <div class="leftSide">
                                    <dnn:links runat="server" id="dnnLINKS" CssClass="links" Level="Root" Separator="&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="footer">
            <div id="footer_left">
                <div id="footer_right">
                    <dnn:COPYRIGHT runat="server" id="dnnCOPYRIGHT" CssClass="footertxt" />&nbsp;|&nbsp;    
                    <dnn:TERMS runat="server" id="dnnTERMS" CssClass="footertxt" />&nbsp;|&nbsp;
                    <dnn:PRIVACY runat="server" id="dnnPRIVACY" CssClass="footertxt" />&nbsp;|&nbsp;
                    <dnn:USER runat="server" id="dnnUSER" CssClass="footertxt" />&nbsp;|&nbsp;
                    <dnn:LOGIN runat="server" id="dnnLOGIN" CssClass="footertxt" />
                </div>
            </div>
        </div>
    </div>
</div>

وSkin.css 

BODY 
{
    background-color:#214081;
    height:100%; 
    margin:0px; 
    padding:0px; 
}
#mainbody
{
    background-image:url(images/home_2_01.jpg);
    background-repeat:repeat-x;
    background-position:top;

    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    text-align: center;
}
#container
{
    width:979px;
    padding: 0;
    text-align:center;
    margin: 0 auto;
}
a
{
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:12px;
    font-weight:normal;
    font-style:normal;
    text-decoration:none;
    color:#000000;
}
.clear
{
    clear:both;
}
#top_banner
{
    /*background-image:url(images/top_banner.gif);
    background-repeat:no-repeat;
    background-position:top;
    width:979px;*/
    height:145px;
}
#top_banner_right
{
    float:right;
    color:#FFFFFF;
    font-size:20px;
    line-height:25px;
    padding-top:70px;
}
#content
{
    background:#fff url(images/home_2_05.jpg) repeat-x top;
    /*background-color:#fff;*/
    min-height:414px;
    padding:0px;
    margin:0px;
}
#content_top_left
{
    background-image:url(images/home_2_04.jpg);
    background-repeat:no-repeat;
    background-position: left top;
    height: 65px;
    padding:0px; margin:0px;

}
#content_top_right
{
    background-image:url(images/home_2_06.jpg);
    background-repeat:no-repeat;
    background-position: right top;
    height: 65px;
    padding:10px 10px 0px 10px; margin:0px;
    /*width:100%;*/

}
#content_bottom
{
    background:url(images/home_2_27.jpg) repeat-x bottom;
    height: 63px;
    padding:0px; 
    margin:0px;
}
#content_bottom_left
{
    background:url(images/home_2_26.jpg) no-repeat bottom left ;
    height: 63px;
    padding:0px; 
    margin:0px;

}
#content_bottom_right
{
    background:url(images/home_2_30.jpg) no-repeat bottom right;
    height: 63px;
    padding:0px; 
    margin:0px;

}
#content_bottom_middle
{
    background:url(images/home_2_28.jpg) no-repeat bottom center;
    height: 63px;
    padding: 0px 0px 0px 0px; 
    margin:0px;

}
#content_all
{
    /*padding: 16px;*/
}
#middle_left
{
    background-image:url(images/home_2_21.jpg);
    background-repeat:repeat-y;
    background-position: left;
    padding: 0px;
    margin:0px;
}
#middle_right
{
    background-image:url(images/home_2_22.png);
    background-repeat:repeat-y;
    background-position: right;
    padding:0px;
    margin:0px;
}
#indent_left
{
    background:url(images/home_2_13.jpg) no-repeat top left;
    padding: 0px; margin:0px;

}
#indent_right
{

    background:url(images/home_2_15.jpg) no-repeat right top;
    padding: 0px 16px 0px 16px; margin:0px 0px 0px 0px;
    overflow: auto;
    /*width: 979px;*/
}

#top_nav
{
    background-image: url(images/home_2_10.jpg);
    background-repeat: repeat-x;
    background-position: top;
    /*width:943px;*/
    height:63px;

}
#nav_left
{
    /*width: 18px;*/
    height: 63px;
    background-image: url(images/home_2_08.jpg);
    background-repeat: no-repeat;
    background-position: top left;
    padding: 0px;
    margin: 0px;
    /*float: left;*/
}
#nav_right
{
    /*width: 21px;*/
    height: 63px;
    background-image: url(images/home_2_12.jpg);
    background-repeat: no-repeat;
    background-position: top right;
    padding: 0px;
    margin: 0px;
    /*float: right;*/
}
#nav_main
{

    padding-top: 10px;
    height: 63px;

}
#video_sub
{
    background-color:#7C7C7C;
    padding:5px;
    color:#FFFFFF;
    text-align:center;
}

/*.main_tab
{
    background-image:url(images/tab_bg.gif);
    background-repeat:no-repeat;
    background-position:top;
    width:648px;
    height:16px;
    padding:15px;
    color:#FFFFFF;
    font-size:14px;
    font-weight:bold;
    text-transform:uppercase;
}*/

#prefooter
{
    margin: 0px;
    text-align: left;
    padding: 10px;
}
#footer
{

    background-image:url(images/home_2_38.jpg);
    background-repeat:repeat-x;
    background-position:top;

    height:95px;
    margin-top: 20px;
    text-align: left;

}
#footer_left
{
    background-image:url(images/home_2_36.jpg);
    background-repeat:no-repeat;
    background-position:left top;
    height: 95px;
}
#footer_right
{
    background-image:url(images/home_2_40.jpg);
    background-repeat:no-repeat;
    background-position:right top;
    height: 95px;
    padding: 36px;
    color: blue;
    /*width: 1036px;*/
}
.footertxt
{
    /*color: #fff;*/
}
td.footertxt {
    font-family: verdana, arial, helvetica;
    color: #FFF;
    font-size:10px;
    font-weight: normal;

}
a.footertxt:link, a.footertxt:visited {
    font-family: verdana, arial, helvetica;
    color: #FFF;
    font-size:10px;
    font-weight: normal;
    text-decoration: none;
}
a.footertxt:hover, a.footertxt:active {
    font-family: verdana, arial, helvetica;
    color: #FFF;
    font-size:10px;
    text-decoration: underline;
    font-weight: normal;
}

.controlpanel {
    width: 100%;
    background-color: #fff;
}

.rightpane {

    width:27%;
    /*margin-right:16px;*/
    /*padding-top:10px;*/
    padding: 0px 0px 0px 10px;
    margin:0px;
}
.leftpane {

    width:27%;
    /*margin-right:16px;*/
    /*padding-top:10px;*/
    padding: 0px 10px 0px 0px;
    margin:0px;
}
.contentpane, .TopPane, .BottomPane, .BannerPane {

    /*width:668px;*/

}
.TopPane, .BottomPane, .BannerPane
{


}
.mid3
{
    width:33%;
    padding: 0px;
    margin: 0px;
}

#breadcrumbs
{
    text-align: left;
    margin-left: 16px;
}

/* begin of menu*/

/*--------- dnn menu style ----------*/
/* main menu td */
.main_dnnmenu_bar 
{
    cursor:pointer;
    font-size: 11px; 
    background-color:transparent;
    width:970px;
}

/*  Main Menu Normal  */
.main_dnnmenu_rootitem  
{   
    color: #fff;
    font-size: 13px; 
    font-weight:bold;   
    text-align:center; 
    padding:12px 12px 12px 12px;
    text-transform:uppercase; margin-right:1px;
    white-space:nowrap;
    float:left;
}


/*  Main menu hover  */
.main_dnnmenu_rootitem_hover
{  
    color:#214081;
    font-size: 13px; 
    font-weight:bold;
    text-align:center;
    padding:12px 12px 12px 12px;
    /*background:url(../images/menu_hover.gif) repeat-x top left;*/
    text-transform:uppercase; margin-right:1px;
    white-space:nowrap;
    float:left;
}

/*  Main menu selected  */
.main_dnnmenu_rootitem_selected 
{
    color:#ffffff;
    font-weight:bold;
    text-align:center;
    font-size: 13px;
    padding:12px 12px 12px 12px;
    /*background:url(../images/menu_active.gif) repeat-x top left;*/
    text-transform:uppercase; margin-right:1px;
    white-space:nowrap;
    float:left;
}

/*  SUB Menu Normal */
.main_dnnmenu_submenu 
{
    /*border:1px solid #C0D6E5;*/
    margin-top: 0px;
    margin-left: 3px;
    background-color: #081E43;  
    z-index: 1000; 
    cursor: pointer; 
    cursor: hand; 
    border-top: #FFFFFF 1px solid;
    border-right: #FFFFFF 1px solid;
    border-left: #FFFFFF 1px solid;
    border-bottom: #FFFFFF 1px solid;
    filter: Alpha(Opacity=75, FinishOpacity=100, Style=1);
    opacity: 0.75;
}

.main_dnnmenu_submenu td
{
    /*background-color:#F8FAFF;*/
    z-index: 1000;
    font-size: 11px; 
    font-weight:bold;
    text-align:left;
    color:#fff;
    line-height:2em;
    padding: 0px 5px;
    margin:0px;
}

/*  SUB Menu hover & selected */
.main_dnnmenu_itemhover td   
{  
    background: #CE0D0D url(../images/submenu_hover.gif) repeat-x top left;
    color:#ffffff;
}
.main_dnnmenu_itemselected td{
    background: #CE0D0D url(../images/submenu_active.gif) repeat-x top left;
    color:#ffffff;
}

.main_dnnmenu_break
{
    height: 2px;
    background-color: #D5E0FF;
}
هل كانت مفيدة؟

المحلول 2

وطيب حصلت عليه. والجواب هو أن تحصل عليه أبحث الحق في FF ثم في DNN تحت إعدادات المضيف تحديد تراجع بشرتك لXHTML 1.0 الصارم بدلا من أتش تي أم أل 4. هذا سوف إصلاح المشكلة.

وشكرا لمساعدة anurse الخاص بك.

نصائح أخرى

ومن الصعب إعطاء نصائح مفيدة بدون معلومات أكثر تفصيلا. هل حاولت تثبيت IE شريط أدوات المطور و الحرائق حتى تتمكن من فحص مباشرة كل التناقض وتحديد بالضبط ما هي الاختلافات؟ أجد هذه الأدوات تجعل من السهل جدا لتحديد القضايا التناسق بحيث يمكنك الرد على سؤال أكثر تحديدا من "هذه الصفحة لا تبدو هي نفسها في IE و Firefox". (أشعر ألمك ... على الرغم من أنه يمكن أن يكون من الصعب جدا لإصلاح هذه المشكلات: S)

coultertech ،
تحديد نوع المستند تراجع الجلد لXHTML من المحتمل ان يكون خيارا جيدا (انها تخلفت فقط إلى HTML لأسباب الإرث). ومع ذلك، المعلومات DOCTYPE تنتمي فعلا مع الجلد، في حد ذاته (قد يكون لديك الجلد واحدة التي تم تصميمها للعمل في HTML، وأخرى مصممة للعمل في XHTML). لتحديد نوع المستند للبشرة، انظر كثل في بلوق وظيفة <لأ href = "http://www.dotnetnuke.com/Community/Blogs/tabid/825/EntryId/2130/The-Fallback-Skin-Doctype-and-skinning .aspx اتصال "يختلط =" نوفولو noreferrer "> استخدام على مستوى الجلد DOCTYPE في .

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top