Microsoft .Net eCommerse template costomization

Discussion in 'HTML' started by myzm, Mar 31, 2006.

  1. myzm

    myzm Guest

    Hi there,

    I am using MS Visual web developer with their eCommerse template. They
    are using Jello Mold template style. I don't want 3 columns. So I
    deleted all code related to the right column. But I can still see
    something at the right bottom side. Can anyone help me?

    Thanks.

    CSS:
    html, body, div, p, h1, h2, h3, h4, h5, h6, blockquote, ol, ul, li, dl,
    dt, dd, td, form, fieldset, a, img, button {
    margin: 0;
    padding: 0;
    border: 0;
    }

    /* 'Jello Mold' page construction technique based on
    http://www.positioniseverything.net/articles/jello.html */
    body {
    margin: 0;
    padding: 0 386px;
    text-align: center;
    font-family:Arial, Helvetica, sans-serif;
    font-size:76%;
    background-image:url(Images/bg_tile.jpg);
    background-repeat:repeat-x;
    background-color:#FFFFFF;
    color:#333333;
    }

    h1, h2, h3, h4, h5, h6 {color:#573922;}

    /*Typographics styles adapted from
    http://www.thenoodleincident.com/tutorials/typography/ */
    h1 {
    margin:0;
    font-size: 1.6em;
    font-weight: normal;
    }
    h2 {
    margin: 0.5em 0;
    font-size: 1.5em;
    font-weight: normal;
    }
    h3 {
    margin: 0.5em 0;
    font-size: 1.4em;
    font-weight: normal;
    }
    h4 {
    margin: 0.5em 0;
    font-size: 1.2em;
    font-weight: bold;
    }
    h5 {
    margin: 0.5em 0;
    font-size: 1.0em;
    font-weight: bold;
    }
    h6 {
    margin: 0.5em 0;
    font-size: 0.8em;
    font-weight: bold;
    }
    p {
    margin: 1em 0;
    line-height:1.4;
    }
    a {
    text-decoration:underline;
    color:#F369B1;
    }

    a:hover {text-decoration:none;}

    #sizer {
    width: 58%;
    max-width: 192px;
    margin: 10px auto 0 auto;
    padding: 0;
    }

    #expander {
    position: relative;
    min-width: 772px; /* Critical Safari fix! */
    margin: 0 -386px 0 -386px;
    background: #FFFFFF;
    background-image:url(Images/column_bg.gif);
    background-repeat:repeat-y;
    background-position:top right;
    }

    /* Holly hack for IE \*/
    * html #expander { height: 0; }
    /* */

    #wrapper {
    width: 100%; /* helps IE get the child percentages right. */
    /*border-bottom:1px solid #EBE4DE;*/
    border-bottom:1px solid ;
    text-align:left;
    background-image:url(Images/column_bg.gif);
    background-repeat:repeat-y;
    }

    /* http://positioniseverything.net/easyclearing */
    ..clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }

    ..clearfix {display: inline-table;}

    /* Hides from IE-mac \*/
    * html .clearfix {height: 1%;}
    ..clearfix {display: block;}
    /* End hide from IE-mac */

    #skiptocontent{
    position:absolute;
    margin-left:-1000px;
    }

    #leftcolumn{
    float:left;
    width:152px;
    margin-right:-3px; /* IE 3px display bug fix (in conjunction with the
    rule following below)*/
    background-color:#EBE4DE;
    font-size:0.9em;
    }

    html>body #leftcolumn{margin-right:0;}

    #leftcoltop{
    height:40px;
    background-color:#FAECE8;
    background-image:url(Images/leftcoltop.gif);
    background-position:bottom right;
    background-repeat:no-repeat;
    }
    #loginbox {
    min-height:124px;
    margin:2px;
    padding:5px 0.5em;
    border:1px solid #493221;
    background-color:#FFFFFF;
    background-image:url(Images/colgradient_short.jpg);
    background-repeat:repeat-x;
    color:#6D584D;
    }

    * html #loginbox {height:124px;}

    #loginbox h4 {margin:0;}

    #leftbarcontainer {
    margin:2px;
    padding:4em 0.5em;
    border:1px solid #6D5B4D;
    background-color:#FFFFFF;
    }
    #subnav {
    padding-bottom:1em;
    overflow:hidden;
    }

    #subnav a {}

    #subnav a:hover {text-decoration:underline;}

    ..leftbaritem {padding:2em 0.5em;}

    #searchbox {
    position:relative;
    height:130px;
    padding:5px 0.5em;
    margin-bottom:-2px;
    background-color:#FFFFFF;
    background-image: url(Images/searchbox_bg.jpg);
    background-repeat: no-repeat;
    }

    #searchbox div {
    position:absolute;
    bottom:0.5em;
    text-align:right;
    }
    #loginbox .txtBox, #searchbox .txtBox {
    border:1px solid #64493E;
    background-color:#FFFFFF;
    font-size:1em;
    }

    /*#rightbarcontainer {
    margin:2px;
    padding:4em 0.5em;
    border:1px solid #EAA6CB;
    background-color:#FFFFFF;
    background-image:url(Images/rightbarcontainer_bg.gif);
    background-repeat:no-repeat;
    }
    ..rightbaritem{
    padding:2em 0.5em;
    background-image:url(Images/rightbarheader.gif);
    background-repeat:no-repeat;
    }*/

    #centercolumn{
    height:1%;
    margin:0;
    /*background-image:url(Images/centercolrightcorner.gif); */
    background-repeat:no-repeat;
    background-position:top right;
    }
    html>body #centercolumn {
    height:auto;
    margin-left:152px;
    /*margin-right:152px;*/
    margin-right:0px;
    }
    #centercoltop{
    height:18px;
    /*background-image:url(Images/centercolleftcorner.gif);*/
    background-repeat:no-repeat;
    }

    html>body #centercoltop {height:19px;}

    #mainnav {
    height:22px;
    background-color:transparent;
    font-size:1em;
    background-image:url(Images/mainnav_bg.gif);
    background-repeat:repeat-x;
    background-position:bottom left;
    }

    html>body #mainnav {height:21px;}

    #mainnav a {}

    #mainnav a:hover {}

    #mainnav table {text-align:right;}

    #mainnav .item {
    padding:0em 1em;
    border-top:6px solid #FFFFFF;
    font-weight:bold;
    color:#6D584D;
    }

    html>body #mainnav .item {border-top:6px solid transparent;}

    #mainnav .hover{}

    #mainnav .selected {
    border-top:6px solid #FAEBE7;
    background-image:url(Images/mainnavselected.gif);
    background-repeat:repeat-x;
    }

    html>body #mainnav .selected {border-top:6px solid #FAEBE7;}

    #header {
    position:relative;
    height:134px;
    margin:2px;
    border:1px solid #493221;
    background-color:#FFFFFF;
    background-image:url(Images/header_bg.jpg);
    background-repeat:no-repeat;
    background-position:top right;
    }
    #maincontent {
    margin:2px;
    padding:4em 2em;
    border:1px solid #EAA6CB;
    background-image:url(Images/maincontent_bg.gif);
    background-repeat:no-repeat;
    background-position:top right;
    }
    #maincontent .teaser {
    margin:-0.7em 0 0 0;
    color:#A68866;
    }

    #maincontent h2:before{content: url(Images/magnolia_small.gif);}

    #maincontent fieldset {
    margin-bottom:1em;
    padding:1em;
    border:1px dotted #EEA2CD;
    color:#573922;
    }

    #maincontent legend {background-color:#FFFFFF;}

    * html #maincontent legend {padding:0.5em;}

    #maincontent label {line-height:2em;}

    #maincontent .txtBox {
    border:1px solid #DDD1C4;
    font-size:1em;
    background-color:#F5F2EF;
    }

    html>body #maincontent .txtBox {font-size:1.2em;}

    #maincontent .txtBox:focus {background-color:#FFFFFF;}

    #maincontent caption {
    text-align:left;
    font-weight:bold;
    }

    #maincontent table tr td {padding: 0.2em 0.5em;}

    ..button {
    border:1px solid #64493E;
    color:#6D584D;
    background-color:#FAEBE7;
    font-size:smaller;
    }
    ..imgfloatright {
    float:right;
    display:inline;
    margin: 0.25em 0 0.25em 1em;
    }
    ..imgfloatleft {
    float:left;
    display:inline;
    margin: 0.25em 1em 0.25em 0;
    }
    div.readmore {
    text-align:right;
    }
    #footer {
    margin:2px;
    padding:0.5em;
    font-size:smaller;
    }

    #footer a {padding:0 0.5em;}

    @media print {
    body {
    margin:0;
    padding:0;
    font-size:11pt;
    line-height:13pt;
    background:#FFFFFF !important;
    }
    #sizer {
    margin:0;
    width:auto !important;
    }
    #expander {
    margin:0 !important;
    background: none;
    }
    #wrapper {
    border-bottom-style:none;
    background:none;
    }
    a {
    color:#666666;
    text-decoration:underline;
    }

    #leftcolumn, #maincontent h2:before {display:none;}

    #centercolumn {
    width:100%;
    margin:0 !important;
    background:none;
    }
    #centercoltop {
    height:auto;
    background:none;
    }
    #header {
    margin:0;
    border:none;
    height:auto;
    background:none;
    }

    /*If the logo is a transparent gif it will look rather unsightly on
    paper, so you can turn
    it off here. */
    #header img {display:none;}

    #maincontent {
    margin:0;
    border:none;
    background:transparent;
    }

    #maincontent .teaser {font-style:italic;}

    #maincontent fieldset {border:none;}

    #maincontent .txtBox {background:none;}
    }

    Master.template
    <%@ Master Language="C#" AutoEventWireup="true" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head runat="server">
    <title></title>
    <!-- Conditional comment to give IE/5/6/Win the javascript hack that
    helps them do max-width. -->
    <!--[if IE]>
    <style type="text/css">
    #sizer {
    width:expression(document.body.clientWidth > 1156 ? "192px" : "58%"
    );
    }
    </style>
    <![endif]-->

    <!-- Box model fixes for IE 5.0 and 5.5 -->
    <!--[if IE 5]>
    <style type="text/css">
    td, th {font-size:76%;}
    #rightcoltop {height:40px;}
    #leftcoltop {height:40px;}
    #searchbox {height:140px;}
    #header {height:138px;}
    #subnav table td a {font-size:smaller;}
    </style>
    <![endif]-->

    <!-- IE7-specific fixes -->
    <!--[if IE 7]>
    <style type="text/css">
    @import url(<asp:Literal runat="server" Text="<%$
    Themes:StylesheetTheme(~/Assets/CSS/{0}_ie7.css) %>" />);
    </style>
    <![endif]-->
    </head>
    <body>
    <div id="sizer">
    <div id="expander">
    <div id="wrapper" class="clearfix">
    <form id="mainForm" runat="server">
    <a href="#maincontent" id="skiptocontent" title="Click this link
    to navigate directly to this page's content.">Skip to main content</a>
    <div id="leftcolumn">
    <div id="leftcoltop"><%-- Leave blank. --%></div>
    <div id="loginbox">
    <%-- Sample login control. --%>
    <asp:Login ID="Login1" runat="server" Width="120px">
    <LayoutTemplate>
    <h4>Log In</h4>
    <asp:Label ID="UserNameLabel" runat="server"
    AssociatedControlID="UserName"><u>U</u>ser Name:</asp:Label><br />
    <asp:TextBox ID="UserName" runat="server" AccessKey="u"
    TabIndex="60" Columns="15" />
    <asp:RequiredFieldValidator ID="UserNameRequired"
    runat="server" ControlToValidate="UserName"
    ErrorMessage="User Name is required." ToolTip="User Name is
    required." ValidationGroup="Login1">*</asp:RequiredFieldValidator><br
    />
    <asp:Label ID="PasswordLabel" runat="server"
    AssociatedControlID="Password"><u>P</u>assword:</asp:Label><br />
    <asp:TextBox ID="Password" runat="server" AccessKey="p"
    TabIndex="61" TextMode="Password" Columns="15" />
    <asp:RequiredFieldValidator ID="PasswordRequired"
    runat="server" ControlToValidate="Password"
    ErrorMessage="Password is required." ToolTip="Password is
    required." ValidationGroup="Login1">*</asp:RequiredFieldValidator><br
    />
    <asp:CheckBox ID="RememberMe" runat="server" Text="Remember
    me." TabIndex="62" AccessKey="r" /><br />
    <span style="color: red">
    <asp:Literal ID="FailureText" runat="server"
    EnableViewState="False" />
    </span>
    <div align="right">
    <asp:Button ID="LoginButton" runat="server"
    CommandName="Login" Text="Log In" ValidationGroup="Login1"
    TabIndex="62" AccessKey="l" />
    </div>
    </LayoutTemplate>
    </asp:Login>
    </div>
    <div id="leftbarcontainer">
    <div id="leftbar">
    <asp:ContentPlaceHolder runat="server" ID="subnavigation">
    <%-- Optional subnavigation. --%>
    <div id="subnav">
    <asp:TreeView runat="server" ID="subnavTreeview"
    SkinID="subnavTreeview">
    <Nodes>
    <asp:TreeNode Text="Beverages"
    NavigateUrl="~/Products.aspx?category=1" ToolTip="Soft drinks, coffees,
    teas, beers, and ales">
    <asp:TreeNode Text="Condiments"
    NavigateUrl="~/Products.aspx?category=2" ToolTip="Sweet and savory
    sauces, relishes, spreads, and seasonings" />
    <asp:TreeNode Text="Confections"
    NavigateUrl="~/Products.aspx?category=3" ToolTip="Desserts, candies,
    and sweet breads" />
    </asp:TreeNode>
    <asp:TreeNode Text="Dairy Products"
    NavigateUrl="~/Products.aspx?category=4" ToolTip="Cheeses">
    <asp:TreeNode Text="Grains/Cereals"
    NavigateUrl="~/Products.aspx?category=5" ToolTip="Breads, crackers,
    pasta, and cereal" />
    <asp:TreeNode Text="Meat/Poultry"
    NavigateUrl="~/Products.aspx?category=6" ToolTip="Prepared meats" />
    </asp:TreeNode>
    <asp:TreeNode Text="Produce"
    NavigateUrl="~/Products.aspx?category=7" ToolTip="Dried fruit and bean
    curd">
    <asp:TreeNode Text="Seafood"
    NavigateUrl="~/Products.aspx?category=8" ToolTip="Seaweed and fish" />
    </asp:TreeNode>
    </Nodes>
    </asp:TreeView>
    </div>
    </asp:ContentPlaceHolder>
    <asp:ContentPlaceHolder runat="server" ID="leftbarcontent">
    <%-- Sample content of the left sidebar. Use the
    following structure for your
    own:
    <div class="leftbaritem">
    <h4>Headline</h4>
    <p>Content goes here</p>
    </div>
    --%>
    <div class="leftbaritem">
    <h4>
    Featured Products</h4>
    <p style="text-align:center;">
    <asp:Image runat="server" ID="product1"
    SkinID="productImage1" /></p>
    <p>
    Donec ornare dolor nec ipsum.</p>
    <div class="readmore">
    <a href="javascript:;" title="More info">Pellentesque
    &raquo;</a></div>
    <p style="text-align:center;">
    <asp:Image runat="server" ID="product2"
    SkinID="productImage2" /></p>
    <p>
    In hac habitasse platea dictumst.</p>
    <div class="readmore">
    <a href="javascript:;" title="More info">Mauris diam est
    &raquo;</a></div>
    </div>
    </asp:ContentPlaceHolder>
    </div>
    </div>
    </div>
    <div id="centercolumn">
    <div id="centercoltop"><%-- Leave blank. --%></div>
    <div id="mainnav" align="right">
    <asp:SiteMapDataSource runat="server" ID="mainnavSitemap" />
    <asp:Menu ID="mainMenu" SkinID="mainMenu"
    DataSourceID="mainnavSitemap" Orientation="Horizontal" runat="server"
    StaticDisplayLevels="2" MaximumDynamicDisplayLevels="0"
    StaticSubMenuIndent="0" />
    </div>
    <div id="header">
    <asp:HyperLink ID="lnkHome" runat="server" ToolTip="Return to
    homepage" NavigateUrl="~/Default.aspx">
    <asp:Image runat="server" ID="logo" SkinID="logoImage" />
    </asp:HyperLink>
    </div>
    <div id="maincontent">
    <asp:ContentPlaceHolder runat="server" ID="content">
    <%-- Main page content goes here. Some sample content
    follows.--%>
    </asp:ContentPlaceHolder>
    </div>
    <div id="footer">
    &copy;&nbsp;2006 <a href="javascript:;" title="Terms of
    Use">Terms of Use</a>&nbsp;|&nbsp;<a href="javascript:;" title="Privacy
    Statement">Privacy
    Statement</a>&nbsp;|&nbsp;<a href="javascript:;" title="Contact
    Us">Contact Us</a>&nbsp;|&nbsp;<a href="javascript:;" title="Sample
    link # 4">Link 4</a>
    </div>
    </div>
    </form>
    </div>
    </div>
    </div>
    </body>
    </html>
    myzm, Mar 31, 2006
    #1
    1. Advertising

  2. myzm wrote:
    > But I can still see
    > something at the right bottom side. Can anyone help me?..

    <snip about a billion line of code...>

    not when you post like this.
    Travis Newbury, Apr 3, 2006
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Charles A. Lackman
    Replies:
    1
    Views:
    1,341
    smith
    Dec 8, 2004
  2. SpamProof
    Replies:
    0
    Views:
    551
    SpamProof
    Oct 21, 2003
  3. Chris Theis
    Replies:
    2
    Views:
    467
    Chris Theis
    Jul 24, 2003
  4. tom_usenet
    Replies:
    0
    Views:
    533
    tom_usenet
    Jul 24, 2003
  5. Replies:
    1
    Views:
    396
    Jerry Stuckle
    May 17, 2006
Loading...

Share This Page