ASCX Skinning 1pane not quite working
Last Post 07/14/2009 4:32 AM by Dave Hassall. 3 Replies.
Author Messages
Dave Hassall
Nuke Pro
Nuke Pro
Posts:86


--
07/11/2009 10:44 AM

    Hi

    I have spent the afternoon gong through the videos for ASCX skinning, really good and well paced.

     

    However when going to the 1 pane option I don’t quite get the same result. To check the 1pane_main.css was working I made some dramatic changes.

     

    #content1pane

    {

          width: 99%;

          background-color: Fuchsia;

          font-style:italic;

          color:Lime;

    }
     

    But the page does not display these setting. The content span the width but I am not convinced it’s because of this CSS file.

     

    Looked at it through Firefox and Web Developer Tool and it says the CSS is loaded and it does contain the details above.

     

    Could you advise what the issue could be.

     

    Also as a future idea could you make dramtic changes, as above, to show a facility is working

    Many thanks

    Dave

    Dave Hassall
    Nuke Pro
    Nuke Pro
    Posts:86


    --
    07/11/2009 11:08 AM

     

    Hi

     

    More info

     

    I played with the skin.css and have discovered that it is in fact the #dnn_contentpane that is driving the content of this area.

     

    I tried a #dnn_content1pane in the 1pane_main.css but to no avail.

     

    I am assuming that something is needed to get the 1pane_main.css to overrule the skin.css

     

    Firefox web developer tool has the tabs in the following order

     

    Default.css, skin.css, 1pane_main.css, container.css


    I need to review that article about the tool to see if there is any significants to this
     

    Regards

     

    Dave

     

     

    Lee Sykes
    DNN Creative Staff
    Nuke Master VI
    Nuke Master VI
    Posts:4945


    --
    07/13/2009 11:12 AM
    Hello,

    The class is working correctly, but the background color section of it has no effect because it is being overridden by a different class.

    Try this:

    #content1pane
    {
        width: 100%;
        border: 1px solid red;
    }

    You will see the width does work correctly and a red border displays.

    If you add:

    #content1pane
    {
        width: 100%;
        border: 1px solid red;
    background-color: grey;
    }

    This does not work. Now look at the skin.css file and the

    #dnn_contentpane
    {
        padding: 10px;
        background-color: #FFF;
        border: 1px solid #CCC;
    }

    This code is specifically targeting the main content pane that DotNetNuke creates and so it is overriding the background color specified in the #content1pane id.

    If you remove the background color for #dnn_contentpane you will see the grey background now displays for the content1pane.

    Thanks,

    Lee Sykes
    Site Administrator
    Subscribe to the website : DotNetNuke Video Tutorials : The Skinning Toolkit : DotNetNuke Podcasts

    Twitter: www.twitter.com/DNNCreative

    Lee Sykes's Facebook Profile
    Dave Hassall
    Nuke Pro
    Nuke Pro
    Posts:86


    --
    07/14/2009 4:32 AM
    Hi Lee

    Thanks

    It's working - but more importantly because it didn't quite work for me this extra info has enhanced the learning experience.

    Thanks

    Dave


    ---