Hello Nina
Thanks for the reply. OK here goes. Sorry about the size of this thread.
This is my container.css file I have used the code from DNNCreative Red Leaf and changed the colours and change the div's to classes.
/*
================================
Container.css
================================
/* style for module title */
.Title_Sponsor {
font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
font-size: 110%;
font-weight: bold;
color: #fff;
}
.containerholder_sponsor
{
border: 1px solid #006633; /*dark green */
margin-bottom: 10px;
background: #E8FFE8; /*light green text box container */
}
.containerholder_transparentbox
{
border: solid 1px #706633; /*dk green */
background-color: transparent;
margin-bottom: 10px;
}
.actions_sponsor
{
border-bottom: 1px solid #006633;
padding: 2px 5px;
background-color:#5B7C7C;
/*TITLE BACKGROUND THIS IS THE BACKGROUND CODE THAT WILL NOT SHOW*/
}
.container_sponsor
{
padding: 6px 5px 0px 5px;
/* height: 100%; */
}
.footer_sponsor
{
}
.sponsor
{
font-size: 1.0em;
}
/* hacks */
/* IE5 needs a height, margin & padding hack */
.containerholder_sponsor, .containerholder_transparent
{
/* for IE 5.5 and below */
height: 1px;
/* reduces the gap between 2 containers and places some
padding under the text */
margin: 0px;
padding: 0 0 8px 0;
voice-family: "\"}\"";
voice-family:inherit;
/* for IE 6 and above */
padding: 0;
height: 100%;
margin-bottom: 10px;
}
.footer_sponsor
{
/* for IE 5.5 and below */
height: 1px;
voice-family: "\"}\"";
voice-family:inherit;
/* for IE 6 and above */
height: 100%;
}
-------------------------------------------------
===========================
Container.ascx
===========================
<%@ Control language="vb" CodeBehind="~/admin/Containers/container.vb" AutoEventWireup="false" Explicit="True" Inherits="DotNetNuke.UI.Containers.Container" %>
<%@ Register TagPrefix="dnn" TagName="DROPDOWNACTIONS" Src="~/Admin/Containers/DropDownActions.ascx" %>
<%@ Register TagPrefix="dnn" TagName="TITLE" Src="~/Admin/Containers/Title.ascx" %>
<%@ Register TagPrefix="dnn" TagName="ACTIONBUTTON1" Src="~/Admin/Containers/ActionButton.ascx" %>
<div class="containerholder_sponsor">
<div class="actions_sponsor"><dnn:DROPDOWNACTIONS runat="server" id="dnnDROPDOWNACTIONS" /><dnn:TITLE runat="server" id="dnnTITLE" CssClass="Title_Sponsor" /></div>
<div id="contentpane" class="container_sponsor" runat="server"></div>
<div iclass="footer_sponsor"><p><dnn:ACTIONBUTTON1 runat="server" id="dnnACTIONBUTTON1" CommandName="AddContent.Action" DisplayIcon="True" DisplayLink="True" /></p></div>
</div>
-----------------------------------------------------------------
=================================================
Skin.css
===============================
body, html {margin:0px; padding:0px 0px 5px 0px; /*background-attachment:fixed;*/ background-color:#5B7C7C; background-image:url(pagebak.jpg); background-position:top left; background-repeat:no-repeat; height: 100%; text-align:center; }
/*Common*/
.Normal, .NormalTextBox, th, tfoot, thead, td, span,div, a, input, textarea{
font-family: Verdana, Arial, Helvetica, Sans Serif; font-size: 10pt; font-weight: normal; color:#303030;line-height: 1.1;}
#wrap {width:800px; text-align:left; margin:auto;}
#leftcol {width:580px;
margin: 5px;
float:left;
vertical-align:top;
padding:4px 2px 4px 4px;}
#tagline {
margin:0px 0px 5px 0;
padding:5px;
border: 1px dotted #5B7C7C;
}
.logoblock {
background-color:#5B7C7C;
height: 150px;
margin:0px;
padding:0px;
border:1px solid #333333;
text-align: center;
overflow: hidden;
}
#header {height: 150px; margin:0px 0px 5px 0; padding:0px; border:1px solid #333333; background-image:url(header.jpg); background-repeat:repeat-x; background-position:top center;}
#introtext {margin:25px 10px 10px 10px; }
.introhead { font: bold x-large Arial, Helvetica, sans-serif; color: #FFFFFF; }
.pagetitle{ font: normal 1.2em Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;}
#spotlight { clear:both; background-color:#FFFFFF; color:#000000; margin:0px 0px 5px 0; padding:5px; border:1px solid #333333; overflow:hidden;}
#spotlight img {padding:3px 4px 0px 0; float:left;}
#lmenu {background-color:#FFFFFF; margin:0px 1px 5px 0; padding:5px; border:1px solid #333333; width:200px; float:left;}
#rightcol { width: 200px; float:right; vertical-align:top; padding: 2px; margin-top: 10px; margin-left:5px; position: absolute;}
.rblock {background-color:#FFFFFF; color:#000000; margin:0px 0px 5px 0; padding:5px; border:1px solid #333333; overflow:hidden;}
.btitle {display: block; clear:both; padding:2px; margin:0px 0px 2px 0; border-bottom:1px dashed #999999;}
#rightcol .btitle {display: block; clear:both; padding:2px; margin:0px 0px 2px 0; border:1px solid #999999; background-color:#ffffff; color:#333333;}
#rfeature {background-color:#FFFFFF; margin:0px 0px 5px 1px; padding:5px; border:1px solid #333333; width:345px; float:right; overflow:hidden;}
#rfeature img {padding:3px 4px 0px 0; float:left;}
#maincontent {clear:both;}
.mainblock {background-color:#FFFFFF; margin:0px 0px 5px 0; padding:5px; border:1px solid #333333; overflow:auto;}
#banners {clear:both; margin:5px; padding:5px; text-align:center;}
#footer {clear:both; text-align:center;}
#loginlinks
{float: right; width: 30%; text-align: right; }
#datecell { float:left; text-align: left: width: 25%;}
#footerlogin, #footertext {clear:both; background-color:#F0F0F0; color:#5B7C7C; margin:auto; padding:5px; border:1px solid #333333; height:30px; width:760px; font-size:0.9em;}
#footertext a {font-weight:bold; color:#5B7C7C; background-color: #F0F0F0; text-decoration:none; border-bottom:1px dashed #333333;} /* unvisited links */
#footertext a:hover {font-weight:bold; color:#FF9900; background-color: #F0F0F0; text-decoration:none; border-bottom:1px solid #5B7C7C;} /* user hovers */
.introbar{
float: left;
width: 65%;
padding-left: 25px;
}
/* TAB STYLES START */
#navbar {clear: both; background-color:#F0F0F0; margin:0px 0px 5px 0; padding:5px; border:1px solid #333333; height:25px;}
#tabarea{
height: 19px;
clear: both;
margin: 0;
padding: 0;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
background: #f0f0f0;
}
#tabarea ul{
position:relative;
margin: 0;
padding: 0;
top:4px;
left:14px;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
background: #fff;
/*height: 17px; */
float: left;
}
#tabarea ul li{
float: left;
display: inline;
list-style: none;
text-align:center;
margin: 0;
padding: 0;
}
#tabarea li a{
display: block;
color:#777777;
font-size: 10px;
font-weight: bold;
text-decoration: none;
border-right: 1px solid #000;
border-bottom: 0px;
margin:0;
padding: 0 5px 1px 5px;
width: auto;
}
#tabarea li a:hover {
background: #336633;
color:#fff;
}
.tabselected{
color:#fff !important;
background: #336633 !important;
/*font-weight:bold; */
}
/* TAB STYLES END */
/* --------------------------------------------- */
/* BREADCRUMB STYLES START */
.breadcrumb {margin-top: 5px;
margin-bottom: 5px;}
a.NormalCrumb, a.NormalCrumb:link, a.NormalCrumb:visited, a.StartCrumb, a.StartCrumb:link, a.StartCrumb:visited
{
display:block;
width:auto;
background:#d2d1c6 url(toggle_gray_down.gif) no-repeat left;
border-bottom:1px solid #000;
border-left:1px solid #000;
border-right:1px solid #000;
margin-top:0px;
text-align: left;
text-decoration:none;
font-size: 10px;
font-weight: bold;
color:#000;
line-height:19px;
overflow:hidden;
padding: 0 5px 1px 20px;
background-position: 3 50%;
}
a.NormalCrumb:hover, a.StartCrumb:hover {color:#000; background:#ccebf5 url(toggle_gray_down.gif) no-repeat left; background-position: 3 50%;}
a.StartCrumb {border-top:1px solid #000;}
/* BREADCRUMB STYLES END */
/* --------------------------------------------- */
/* LEFTMENU STYLES START */
.leftMenu {
height: auto;
margin-top: 5px;
margin-bottom: 5px;
}
a.NormalNode, a.NormalNode:link, a.NormalNode:visited, a.StartNode, a.StartNode:link, a.StartNode:visited
{
display:block;
width:auto;
background:#FFFFFF url(toggle_gray_right.gif) no-repeat left;
border-bottom:1px solid #000;
border-left:1px solid #000;
border-right:1px solid #000;
margin-top:0px;
text-align: left;
text-decoration:none;
font-size: 10px;
font-weight: bold;
color:#000;
line-height:19px;
overflow:hidden;
padding: 0 5px 1px 20px;
background-position: 3 50%;
}
a.NormalNode:hover, a.StartNode:hover {color:#000; background:#ccebf5 url(toggle_gray_right.gif) no-repeat left; background-position: 3 50%;}
a.StartNode {border-top:1px solid #000; background:#FFFFFF;}
/* LEFTMENU STYLES END */
/* --------------------------------------------- */
#headersearch{
margin-top: 1px;
padding:2px 2px 2px 2px;
border:1px solid #000;
background:#CCC;
}
#headersearch form{
margin: 0;
padding: 0;
}
#headersearch img{
margin-right: 5px;
padding: 0;
float: left;
}
#headersearch input{
font-size:1em;
margin-right: 2px;
padding:1px 0 0 2px;
border-top:1px solid #5d747c;
border-right:1px solid #5d747c;
border-bottom:1px solid #aaa;
border-left:1px solid #aaa;
width:127px;
color:#333;
background:#fff;
}
#headersearch p{
margin: 0;
padding: 0;
font-size:0.65em;
color:#fff;
background:transparent;
}
#headersearch a:link,#headersearch a:visited{
color:#333;
background:transparent;
}
.clearbig
{
line-height: 10px;
background: transparent;
}
.clearboth{clear:both;font-size:0px;line-height:0px;}
/* ================================
style for module titles
================================ */
.actions_sponsor { background-color:#5B7C7C;}
/* fix for control panel being unable to handle relative font size */
span.control * span.SubHead
{
font-size:10pt;
}
.SkinObject {
font-weight: bold;
font-size: 0.8em;
}
A.SkinObject:link, A.SkinObject:visited, A.SkinObject:active {
text-decoration: none;
}
A.SkinObject:hover {
text-decoration: underline;
}
.Head {
font-size: 1.3em;
font-weight: bold;
}
.SubHead {
font-size: 1.1em;
font-weight: bold;
}
.SubSubHead {
font-size: 1.0em;
font-weight: bold;
}
.Normal, .NormalDisabled, .NormalTextBox, .NormalRed, .NormalBold,.NormalTextBox
{ font-family: verdana, tahoma, arial, helvetica, sans-serif;
}
.NormalBold
{
font-size: 1.0em;
font-weight: bold;
}
.NormalRed
{
font-size: 1.0em;
font-weight: bold;
color: #ff0000;
}
.NormalTextBox
{
font-size: 0.9em;
font-weight: normal;
}
.CommandButton
{
font-size: 1em;
font-weight: normal;
}
A.CommandButton:link, A.CommandButton:visited, A.CommandButton:active {
text-decoration: underline;
}
A.CommandButton:hover {
text-decoration: underline;
}
.StandardButton
{
padding-right: 5px;
padding-left: 5px;
font-weight: normal;
font-size: 1.0em;
}
SMALL {
font-size: 0.8em;
}
BIG {
font-size: 1.2em;
}
BLOCKQUOTE, PRE {
font-family: Lucida Console, monospace;
}
hr {
height:1pt;
text-align:left;
color: #5B7C7C;
}
/* ------------------------
Links format added for opera browser
----------- */
.Normal A:link, .Normal A:visited, .Normal A:active
{
text-decoration: none;
color: #036; font: normal 0.9em verdana, tahoma, arial, helvetica, sans-serif;
}
.Normal A:hover
{
text-decoration: underline;
color: #F00;
}
/* This is the Date eg. any items that are not links */
#utilitiesbar{
clear:both;
border: 1px dotted #000000;
}
.enquiries {float:right; width:45%; }
.pagegenerated{
width:40%;
float:left;
}
.SkinItem {
font-weight: bold;
font-size: 0.8em;
text-decoration: none;
color: #006633;
}
/* This sets the style for all skin items that are links */
A.SkinItem:link, A.SkinItem:visited, A.SkinItem:active
{
text-decoration: none;
color: #006633;
}
A.SkinItem:hover
{
text-decoration: underline;
color: #F00;
}
/* =======================
HTML Tag Styles
=========================== */
h1, h2, h3, h4, h5, dt, h6
{
font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif; color: #303030;
}
h1
{
font-size: 1.50em;
font-weight: bold;
}
h2
{
font-size: 1.4em;
font-weight: bold;
color: #C00;
}
h3
{
font-size: 1.2em;
font-weight: bold;
}
h4
{
font-size: 1.0em;
font-weight: normal;
margin: 0;
}
h5, dt
{
font-size: 0.9em;
font-weight: normal;
margin: 0;
}
h6
{
font-size: 0.8em;
font-weight: normal;
margin: 0;
}
TFOOT, THEAD {
font-size: 1.1em;
}
th {
vertical-align: baseline;
font-size: 1.1em;
font-weight: bold;
}
A:link, A:active, A:visited {
text-decoration: none;
}
A:hover {
text-decoration: underline;
}
/* Styles for the main text and images within the Text/HTML module */
.imageleftside img
{
border: 1px solid #CCC;
margin-right: 15px;
margin-bottom: 20px;
float: left;
}
.imagerightside img
{
border: 1px solid #CCC;
margin-left: 15px;
margin-bottom: 20px;
float: right;
}
.imageleftsidecaption
{
font-size: 0.9em;
font-style: italic;
float: left;
margin-right: 15px;
margin-bottom: 15px;
}
.imageleftsidecaption img
{
border: 1px solid #CCC;
margin-bottom: 5px;
}
.imagerightsidecaption
{
font-size: 0.9em;
font-style: italic;
float: right;
margin-left: 15px;
margin-bottom: 15px;
}
.imagerightsidecaption img
{
border: 1px solid #CCC;
margin-bottom: 5px;
}
.clear
{
clear: both;
}
.quoteleft
{
font: italic 105% Georgia, "Times New Roman", Times, Serif;
padding: 0 10px 0 0;
margin: 10px 10px 10px 0;
width: 220px;
float: left;
text-align: right;
border-right: 10px solid #C8CDD0;
color: #75818A;
}
.quoteright
{
font: italic 105% Georgia, "Times New Roman", Times, Serif;
padding: 0 0 0 10px;
margin: 10px 0 10px 10px;
width: 220px;
float: right;
text-align: left;
border-left: 10px solid #C8CDD0;
color: #75818A;
}
.greenbox {
background-color: #CCFFCC;
color: inherit;
border: 1px solid #00CC33;
margin: 2px;
padding: 5px;
}
.yellowbox {
background-color: #FFFF99;
color: inherit;
border: 1px solid #CCCC66;
padding: 5px;
margin: 2px;
}
.bluebox {
background-color: #3399FF;
border: 1px solid #0000ff;
color: inherit;
padding: 5px;
margin: 2px;
}
.redbox {
background-color: #FF6666;
border: 1px solid #ff3333;
color: inherit;
padding: 5px;
margin: 2px;
}
/*Control panel*/
.controlpanel{background:#FFF;border:#CCC solid;border-width:0px 0px 2px;}
.controlpanel img{margin:15px 5px 0px;}
.controlpanel td td td td img{margin:0px;}
.controlpanel td td td{width:auto;}
.controlpanel DIV{border:#CCC solid;border-width:0px 1px;width:3px;height:100px;}
.controlpanel td .SubHead{background:#CCC;font-size:12px;color:#333;font-weight:bold;}
.controlpanel td td td .SubHead{background:transparent;border:0px;font-size:11px;color:#333;font-weight:normal;}
.controlpanel td td td input{font-size:11px;color:#000;font-weight:bold;padding-left:4px;}
.controlpanel td td td select{font-size:11px;color:#333;}
.controlpanel a.CommandButton{font-size:10px;text-decoration:none;}
.controlpanel a.CommandButton:link{color:#000;text-decoration:none;}
.controlpanel a.CommandButton:visited{color:#000;text-decoration:none;}
.controlpanel a.CommandButton:hover{color:#F00;text-decoration:underline;}
.controlpanel a.CommandButton:active{color:#000;text-decoration:none;}
-----------------------------------------------------------------------
==================================================
Skin.ascx
================================================
<%@ Control language="vb" CodeBehind="~/admin/Skins/skin.vb" AutoEventWireup="false" Explicit="True" Inherits="DotNetNuke.UI.Skins.Skin" %>
<%@ Register TagPrefix="dnn" TagName="LOGO" Src="~/Admin/Skins/Logo.ascx" %>
<%@ Register TagPrefix="dnn" TagName="VENTUREPORTALTITLE" Src="~/DesktopModules/DnnForge.Venture.SkinObjects/PortalTitle.ascx" %>
<%@ Register TagPrefix="dnn" TagName="SEARCH" Src="~/Admin/Skins/Search.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="VENTURETOPMENU" Src="~/DesktopModules/DnnForge.Venture.SkinObjects/TopMenu.ascx" %>
<%@ Register TagPrefix="dnn" TagName="VENTUREBREADCRUMB" Src="~/DesktopModules/DnnForge.Venture.SkinObjects/BreadCrumb.ascx" %>
<%@ Register TagPrefix="dnn" TagName="VENTURELEFTMENU" Src="~/DesktopModules/DnnForge.Venture.SkinObjects/LeftMenu.ascx" %>
<%@ Register TagPrefix="dnn" TagName="COPYRIGHT" Src="~/Admin/Skins/Copyright.ascx" %>
<%@ Register TagPrefix="dnn" TagName="TERMS" Src="~/Admin/Skins/Terms.ascx" %>
<%@ Register TagPrefix="dnn" TagName="PRIVACY" Src="~/Admin/Skins/Privacy.ascx" %>
<%@ Register TagPrefix="speerio" TagName="SKINPREFS" Src="~/controls/Speerio/Skinergy/skinprefs.ascx" %>
<%@ Register TagPrefix="speerio" TagName="PALETTES" Src="~/controls/Speerio/Skinergy/palettes.ascx" %>
<%@ Register TagPrefix="dnn" TagName="CURRENTDATE" Src="~/Admin/Skins/CurrentDate.ascx" %>
<%@ Register TagPrefix="dnn" TagName="PAGETITLE" Src="~/DesktopModules/PageTitle/PageTitle.ascx" %>
<%@ Register TagPrefix="dnn" TagName="LINKS" Src="~/Admin/Skins/Links.ascx" %>
<%@ Register TagPrefix="dnn" TagName="BANNER" Src="~/Admin/Skins/Banner.ascx" %>
<%@ Register TagPrefix="dnn" TagName="SUPPORTINFO" Src="~/DesktopModules/SupportInfo/Supportinfo.ascx" %>
<%@ Register TagPrefix="dnn" TagName="PAGEGENERATED" Src="~/DesktopModules/PageGenerated/PageGenerated.ascx" %>
<div id="ControlPanel" runat="server"></div>
<div id="wrap">
<div id="leftcol">
<div id="tagline"><div runat="server" id="tagline" ></div>
</div>
<div id="banners"><dnn:BANNER runat="server" id="dnnBANNER" />
</div>
<div id="header">
<div id="introtext">
<h1 class="introhead">A2ZDom.com</h1>
<p><dnn:PAGETITLE runat="server" id="dnnPAGETITLE" CssClass="pagetitle" />
</p><div class="introbar"><div runat="server" id="pageintro" > </div>
</div>
</div>
</div>
<div id="navbar">
<div id="tabarea">
<dnn:VENTURETOPMENU runat="server" id="dnnVENTURETOPMENU" />
</div>
</div>
<div class="clear"> </div>
<div id="lmenu"> <div class="breadcrumb">
<dnn:VENTUREBREADCRUMB runat="server" id="dnnVENTUREBREADCRUMB" /></div>
<div class="leftMenu"><dnn:VENTURELEFTMENU runat="server" id="dnnVENTURELEFTMENU" /> </div>
<div id="headersearch">
<p><dnn:SEARCH runat="server" id="dnnSEARCH" /></p>
</div><div class="btitle">
<h4><speerio:PALETTES runat="server" /></h4>
</div>
<div class="btitle">
<h4><speerio:SKINPREFS runat="server" mode="Both" /></h4>
</div>
<p> <div runat="server" id="LeftFeature" ></div></p>
</div>
<div id="rfeature">
<div runat="server" id="ContentPane"></div>
<p><div runat="server" id="ItemContent" ></div></p>
</div>
<div id="maincontent">
<div class="mainblock">
<div runat="server" id="MainContent" ></div>
</div>
<div class="mainblock">
<div runat="server" id="MoreContent" ></div>
</div>
</div>
</div><!--end left col -->
<div id="rightcol">
<div class="logoblock">
<dnn:LOGO runat="server" id="dnnLOGO" />
</div>
<div class="rblock">
<div runat="server" id="eventsPane" > </div>
</div>
<div class="rblock">
<div runat="server" id="RightNews" ></div>
</div>
<div class="rblock">
<div runat="server" id="story" ></div>
</div>
</div>
<!--end right col -->
<div class="clearbig"> </div>
<div id="footer">
<div id="footerlogin">
<div id="datecell"> <dnn:CURRENTDATE runat="server" id="dnnCURRENTDATE" CssClass="SkinItem" />
</div>
<div id="loginlinks">
<dnn:USER runat="server" id="dnnUSER" CssClass="SkinItem" /> | <dnn:LOGIN runat="server" id="dnnLOGIN" CssClass="SkinItem" /></div></div>
<div id="footertext">
<dnn:LINKS runat="server" id="dnnLINKS" CssClass="footer" Level="Root" Separator=" | " /><br /><br />
<dnn:PRIVACY runat="server" id="dnnPRIVACY" CssClass="footertext" /> | <dnn:TERMS runat="server" id="dnnTERMS" CssClass="footertext" /> | <dnn:COPYRIGHT runat="server" id="dnnCOPYRIGHT" CssClass="footertext" /><br />
<div id="utilitiesbar"><div class="pagegenerated">..:: <dnn:PAGEGENERATED runat="server" id="dnnPAGEGENERATED" CssClass="SkinItem" />::.. </div> <div class="enquiries"><dnn:SUPPORTINFO runat="server" id="dnnSUPPORTINFO" CssClass="SkinItem" /></div></div>
</div>
</div> <!--end footer -->
</div>
----------------------------------------------------------
Thanks
Regards
Laura