I am trying to split a div and define the sizes of the two sections within the div., but am experiencing some problems with this process. Basically, I have a div defined as: <div class="contentrow1" runat="server" ID="row1" visible="true"> and i would like to split the div (item1 : width: 52% and item2: width: 48%) inside the "row1" Div and place modules inside the item1 and item2 Divs..
Below is the base ascx file that shows the base structure, with the section I am trying to modify highlighted with bold text:
<!--Doctype Declaration and CSS Links--------------------------------------------------- -->
<%@ 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="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" %>
<link href="skin.css" rel="stylesheet" type="text/css" />
<!--
Created by Kim Peterson v1.0
-->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="script.js"></script>
<body>
<div id="main">
<div class="box sheet">
<div class="box-body sheet-body">
<div class="header">
<!-- header -->
<div class="header" runat="server" id="header" visible="true">
</div>
</div>
<div class="bar nav">
<div class="nav-outer">
<ul class="hmenu">
<li><a href="./Home.aspx" class="active">Home</a> </li>
<li><a href="./AboutUs.aspx">About Us</a> </li>
<li><a href="./Products.aspx">Products</a> </li>
<li><a href="./Warranty.aspx">Warranty</a> </li>
<li><a href="./Suppliers.aspx">Suppliers</a> </li>
<li><a href="./ContactUs.aspx">Contact Us</a> </li>
</ul>
</div>
</div>
<div class="contentrow1" runat="server" id="row1" visible="true">
<div class="item1" runat="server" id="item_1" visible="true">
</div>
<div class="item2" runat="server" id="item_2" visible="true">
</div>
</div>
<div class="contentrow2" runat="server" id="row2" visible="true">
</div>
<div class="contentrow3" runat="server" id="row3" visible="true">
</div>
<div class="footer">
<div class="footer-body">
<div class="footer-center">
<div class="footer-wrapper">
<div class="footer-text">
<p>
Copyright © 2012, Johnson Lifters. All Rights Reserved.</p>
<p class="page-footer">
<a href="http://www.johnsonlifters.com" target="_blank"></a>created by Frustrated
Incorporated.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
Under layout I see the Row1, Row2 and Row3 Div's, I do not see the internal Div's: item_1 or item_2, also under the module menu, I do not see the internal Div's listed to be able to place a module inside them. I am able to place a module inside the Row1 Div. but it extends thru the entire Div.
Can someone please tell me what I am doing wrong here? Any suggestions are greatly appreciated.