DNN Admin Control Styling

This is a simple, clean style for use in the admin sections of DotNetNuke controls.

#promotionalSpace { width:100%; font-family:Arial; text-align:left; margin-bottom:15px; }
    #promotionalSpace .shadow { width:100%; text-align:center; padding:20px 0; }
    #promotionalSpace .container {width:600px; background-color:#ffffff; text-align:left; margin:0 auto; border:solid 1px #E9E9E9; }   
    #promotionalSpace #navigation { width:600px; height:30px; margin-bottom:20px; }
    #promotionalSpace #navigation .link { padding:5px; float:left; }
    #promotionalSpace h3 { font-size:16px; font-weight:bold; }
    #promotionalSpace h4 { font-size:15px; font-weight:bold; }
    #promotionalSpace h5 { font-size:14px; font-weight:bold; }
    #promotionalSpace h6 { font-size:13px; font-weight:bold; background-color:#E9E9E9; margin:5px; padding:5px; }
    #promotionalSpace .Success { color:#339900; background-color:#ccffcc; padding:2px; border:dashed 1px #339900; margin:10px; }
    #promotionalSpace .Error { color:Red; background-color:#ffffcc; padding:2px; border:dashed 1px red; margin:10px; }
    #promotionalSpace .Message { color:Blue; background-color:#D0EDFC; padding:2px; border:dashed 1px blue; margin:10px; }
    #promotionalSpace .button { padding:2px; margin:3px; border:solid 2px #A9D6FD; color:blue; background-color:#D2E7F9; text-decoration:none; display:inline-block; }
        #promotionalSpace .button:hover { color:blue; background-color:#A9D6FD; }
    #promotionalSpace #title { width:100%; height:30px; background-color:#EDF3FE; padding:10px 0; margin-bottom:10px; }
        #promotionalSpace #title h3 { color:#000; padding:5px; margin:0; }
    #promotionalSpace #content { width:100%;  }
        #promotionalSpace #content .control { width:100%; margin:3px; }
        #promotionalSpace #content .spacer { width:100%; height:20px; }
        #promotionalSpace #content .left { text-align:left; }

#promotionTemplate { width:156px; border:solid 1px #A9D6FD; float:left; margin:5px; padding:2px; background-color:#D2E7F9; text-align:center; }
    #promotionTemplate .box { width:154px; background-color:#ffffff; margin:0 auto; text-align:left; }
    #promotionTemplate .clear { clear:both; }
    #promotionTemplate .thumbnail { width:150px; height:150px; margin:2px; }
    #promotionTemplate .details { width:150px; padding:2px; }
        #promotionTemplate .details .control { width:100%; margin:3px; }

Published by

Tim Clark

Experienced Business Owner, Chief Information Officer, Vice President, Chief Software Architect, Application Architect, Project Manager, Software Developer, Senior Web Developer, Graphic Designer & 3D Modeler, University Instructor, University Program Chair, Academic Director. Specialties: Ruby, Ruby on Rails, JavaScript, JQuery, AJAX, Node.js, React.js, Angular.js, MySQL, PostgreSQL, MongoDB, SQL Server, Responsive Design, HTML5, XHTML, CSS3, C#, ASP.net, Project Management, System Design/Architecture, Web Design, Web Development, Adobe CS6 (Photoshop, Illustrator)

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s