Results 1 to 5 of 5
  1. #1
    Join Date
    Dec 2005
    Posts
    136
    Plugin Contributions
    0

    Default Space between Header and Content Boxes

    My site

    At the bottom of the Header to the top of the boxes, there is a space. I was lookin at the margin settings and padding settings, but I was unsuccessful.

    How Do I reduce the space?


    Here's my stylesheet:
    /**
    * Main CSS Stylesheet
    *
    * @package templateSystem
    * @copyright Copyright 2003-2006 Zen Cart Development Team
    * @copyright Portions Copyright 2003 osCommerce
    * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
    * @version $Id: stylesheet.css 4387 2006-09-04 13:54:28Z drbyte $
    */

    body { color: #999; font-size: 11px; font-family: arial, verdana, arial, helvetica, sans-serif; background-color: #666666; margin: 0}

    a img {border: none; }

    a:link, #navEZPagesTOC ul li a {
    color: #999999;
    text-decoration: none;
    }

    a:visited { color: #999; text-decoration: none }

    a:hover, #navEZPagesTOC ul li a:hover, #navMain ul li a:hover, #navSupp ul li a:hover, #navCatTabs ul li a:hover { color: #ccc }

    a:active { color: #333 }

    h1 { color: #666666; font-size: 16px; font-weight: bold }

    h2 { font-size: 16px; font-weight: bold }

    h3 { font-size: 16px; font-weight: bold }

    h4, h5, h6, LABEL, h4.optionName, LEGEND, ADDRESS, .sideBoxContent, .larger { font-size: 13px; font-weight: bold }

    .biggerText { font-size: 1.2em; font-weight: bold }

    h1, h2, h3, h4, h5, h6 {
    margin: 0.3em 0;
    }

    /* Might uncomment either or both of these if having problems with IE peekaboo bug:
    h1, h2, h3, h4, h5, h6, p {
    position: relative;
    }
    *html .centerColumn {
    height: 1%;
    }
    */

    CODE {
    font-family: arial, verdana, helvetica, sans-serif;
    font-size: 1em;
    }

    FORM, SELECT, INPUT {
    display: inline;
    font-size: 1em;
    margin: 0.1em;
    }

    TEXTAREA {
    float: left;
    margin: auto;
    display: block;
    width: 95%;
    }

    input:focus, select:focus, textarea:focus {
    background: #E4FEF5;
    }

    FIELDSET {
    padding: 0.5em;
    margin: 0.5em 0em;
    border: 1px solid #cccccc;
    }

    LEGEND {
    font-weight: bold;
    padding: 0.3em;
    }

    LABEL, h4.optionName {
    line-height: 1.5em;
    padding: 0.2em;
    }

    LABEL.checkboxLabel, LABEL.radioButtonLabel {
    margin: 0.5em 0.3em;
    }

    #logo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {
    float: left;
    }

    LABEL.inputLabel {
    width: 9em;
    float: left;
    }

    LABEL.inputLabelPayment {
    width: 14em;
    float: left;
    padding-left: 2.5em;
    }

    LABEL.selectLabel, LABEL.switchedLabel, LABEL.uploadsLabel {
    width: 11em;
    float: left;
    }

    #checkoutPayment LABEL.radioButtonLabel {
    font-weight: bold;
    }

    P, ADDRESS {
    padding: 0.5em;
    }

    ADDRESS {
    font-style: normal;
    }

    .clearBoth {
    clear: both;
    }

    HR {
    height: 1px;
    margin-top: 0.5em;
    border: none;
    border-bottom: 1px solid #9a9a9a;
    }

    /*warnings, errors, messages*/
    .messageStackWarning, .messageStackError, .messageStackSuccess, .messageStackCaution {
    line-height: 1.8em;
    padding: 0.2em;
    border: 1px solid #9a9a9a;
    }

    .messageStackWarning, .messageStackError {
    background-color: #ff0000;
    color: #ffffff;
    }

    .messageStackSuccess {
    background-color: #99FF99;
    color: #000000;
    }

    .messageStackCaution {
    background-color: #FFFF66;
    color: #000000;
    }

    /*wrappers - page or section containers*/
    #mainWrapper {
    background-color: #ffffff;
    text-align: left;
    width: 800px;
    vertical-align: top;
    border: 0px solid #cccccc;
    }

    #headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
    margin: 0em;
    padding-bottom: 0em;
    }

    #logoWrapper{
    background-image: url(../images/header_bg.jpg);
    background-repeat: repeat-x;
    background-color: #ffffff;
    height:75px;
    }

    #navColumnOneWrapper, #navColumnTwoWrapper, #mainWrapper {
    margin: auto;
    }
    #navColumnOneWrapper, #navColumnTwoWrapper {
    margin-left: 0.5em;
    margin-right: 0.5em;
    }

    #tagline {
    color:#999999;
    font-size: 2em;
    text-align : center;
    vertical-align: middle;
    }

    #sendSpendWrapper {
    border: 1px solid #cacaca;
    float: right;
    margin: 0em 0em 1em 1em;
    }

    .floatingBox, #accountLinksWrapper, #sendSpendWrapper, #checkoutShipto, #checkoutBillto, #navEZPagesTOCWrapper {
    margin: 0;
    width: 47%;
    }

    .wrapperAttribsOptions {
    margin: 0.3em 0em;
    }

    /*navigation*/

    .navSplitPagesResult {}
    .navSplitPagesLinks {}

    .navNextPrevCounter {
    margin: 0em;
    font-size: 0.9em;
    }
    .navNextPrevList {
    display: inline;
    white-space: nowrap;
    margin: 0;
    padding: 0.5em 0em;
    list-style-type: none;
    }

    #navMainWrapper, #navSuppWrapper {
    margin: 0em;
    background-color: #666666;
    padding: 0.0em 0.2em;
    font-weight: bold;
    color: #999999;
    height: 1%;
    }

    #navCatTabsWrapper {
    background-color: #666666;
    color: #9a9a9a;
    background-image:none;
    }




    #navMain ul, #navSupp ul, #navCatTabs ul {
    margin: 0;
    padding: 0.5em 0em;
    list-style-type: none;
    text-align: center;
    line-height: 1.5em;
    }

    #navMain ul li, #navSupp ul li, #navCatTabs ul li {
    display: inline;
    }

    #navMain ul li a, #navSupp ul li a, #navCatTabs ul li a { color: #999; text-decoration: none; white-space: nowrap; margin: 0; padding: 0 0.8em }

    #navCatTabs ul li a {
    color: #ffffff;
    }

    #navEZPagesTOCWrapper {
    font-weight: bold;
    float: right;
    height: 1%;
    border: 1px solid #9a9a9a;
    }

    #navEZPagesTOC ul {
    margin: 0;
    padding: 0.5em 0em;
    list-style-type: none;
    line-height: 1.5em;
    }

    #navEZPagesTOC ul li {
    white-space: nowrap;
    }

    #navEZPagesTOC ul li a {
    padding: 0em 0.5em;
    margin: 0;
    }

    #navMainSearch, #navCategoryIcon, .buttonRow, #indexProductListCatDescription {
    margin: 0.5em;
    }

    #navBreadCrumb {
    padding: 0.5em 0.5em;
    margin: 1px;
    background-color: #ffffff;
    font-size: 1.2em;
    font-weight: bold;
    margin: 0em;
    }

    #navEZPagesTop {
    background-color: #333333;
    background-image: url(../images/tile_back.gif);
    font-size: 1.4em;
    font-weight: bold;
    margin: 0em;
    padding: 0.5em;
    }

    #navColumnOne, #navColumnTwo {
    background-color: transparent;
    }

    /*The main content classes*/
    #contentColumnMain, #navColumnOne, #navColumnTwo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .alert {
    vertical-align: top;
    }

    /*.content,*/ #productDescription, .shippingEstimatorWrapper {
    /*font-size: 1.2em;*/
    padding: 0.5em;
    }

    .alert {
    color: #FF0000;
    margin-left: 0.5em;
    }
    .advisory {}
    .important {
    font-weight: bold;
    }
    .notice {}
    .rating{}
    .gvBal {
    float: right;
    }
    .centerColumn, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
    border: 1px solid #cccccc;
    padding: 0.8em;
    margin-bottom: 0.5em;
    }

    .smallText, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP {
    font-size: 0.9em;
    }

    /*Shopping Cart Display*/
    #cartAdd {
    float: right;
    background-color: #ffffff;
    font-weight: bold;
    text-align: center;
    margin: 1em;
    border: 1px solid #cccccc;
    padding: 1em;
    }

    .tableHeading TH {
    border-bottom: 1px solid #9a9a9a;
    }

    .tableHeading, #cartSubTotal {
    background-color: #e9e9e9;
    }

    #cartSubTotal {
    border-top: 1px solid #cccccc;
    font-weight: bold;
    text-align: right;
    line-height: 2.2em;
    padding-right: 2.5em;
    }

    .tableRow, .tableHeading, #cartSubTotal {
    height: 2.2em;
    }

    .cartProductDisplay, .cartUnitDisplay, .cartTotalDisplay, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, #cartInstructionsDisplay, .cartTotalsDisplay {
    padding: 0.5em 0em;
    }

    .cartUnitDisplay, .cartTotalDisplay {
    text-align: right;
    padding-right: 0.2em;
    }

    #scUpdateQuantity {
    width: 2em;
    }

    .cartQuantity {
    width: 4.7em;
    }

    .cartNewItem {
    color: #33CC33;
    position: relative; /*do not remove-fixes stupid IEbug*/
    }

    .cartOldItem {
    color: #660099;
    position: relative; /*do not remove-fixes stupid IEbug*/
    }

    .cartBoxTotal {
    text-align: right;
    font-weight: bold;
    }

    .cartRemoveItemDisplay {
    width: 3.5em;
    }

    .cartAttribsList {
    margin-left: 1em;
    }

    #mediaManager {
    width: 50%;
    margin: 0.2em;
    padding: 0.5em;
    background-color: #E4FEf5;
    border: 1px solid #003D00;
    }

    .normalprice, .productSpecialPriceSale {
    text-decoration: line-through;
    }

    .productSpecialPrice, .productSalePrice, .productSpecialPriceSale, .productPriceDiscount {
    color: #ff0000;
    }

    .orderHistList {
    margin: 1em;
    padding: 0.2em 0em;
    list-style-type: none;
    }

    #cartBoxListWrapper ul, #ezPageBoxList ul {
    list-style-type: none;
    }

    #cartBoxListWrapper li, #ezPageBoxList li, .cartBoxTotal {
    margin: 0;
    padding: 0.2em 0em;
    }

    #cartBoxEmpty, #cartBoxVoucherBalance {
    font-weight: bold;
    }

    .totalBox {
    width: 5.5em;
    text-align: right;
    padding: 0.2em;
    }

    .lineTitle, .amount {
    text-align: right;
    padding: 0.2em;
    }

    .amount {
    width: 5.5em;
    }

    /*Image Display*/
    #productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage {
    margin: 0em 1em 1em 0em ;
    }

    .categoryIcon {}

    #cartImage {
    margin: 0.5em 1em;
    }

    /*Attributes*/
    .attribImg {
    width: 20%;
    margin: 0.3em 0em;
    }

    .attributesComments {}

    /*list box contents*/
    .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew {
    margin: 1em 0em;
    }

    .centerBoxWrapper {
    border: 1px solid #9a9a9a;
    height: 1%;
    margin: 1.1em 0;
    }

    h2.centerBoxHeading {
    font-size: 1.3em;
    color: #666666;
    }

    /*sideboxes*/
    .columnLeft {
    background-color: #666666;
    }

    h3.leftBoxHeading, h3.leftBoxHeading a,
    h3.rightBoxHeading, h3.rightBoxHeading a {
    font-size: 1em;
    color: #ffffff;
    }
    #manufacturersHeading, #currenciesHeading, #musicgenresHeading, #recordcompaniesHeading, #searchHeading, #search-headerHeading {
    font-size: 0.1em;
    color: #ffffff;
    }

    .leftBoxHeading, .centerBoxHeading, .rightBoxHeading {
    margin: 0em;
    background-color: #666666;
    padding: 0.0em 0.0em;
    }

    .leftBoxContainer, .rightBoxContainer {
    margin: 0em;
    border: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    margin-top: 0.0em;
    margin-bottom: 1.5em;
    }

    .sideBoxContent {
    background-color: #ffffff;
    padding: 0.4em;
    }

    h3.leftBoxHeading a:hover, h3.rightBoxHeading a:hover {
    color: #FFFF33;
    text-decoration: none;
    }

    .rightBoxHeading a:visited, .leftBoxHeading a:visited, .centerBoxHeading a:visited {
    color: #FFFFFF;
    }

    .centeredContent, TH, #cartEmptyText, #cartBoxGVButton, #cartBoxEmpty, #cartBoxVoucherBalance, #navCatTabsWrapper, #navEZPageNextPrev, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP, .center, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, .cartTotalsDisplay, #cartBoxGVBalance, .leftBoxHeading, .centerBoxHeading,.rightBoxHeading, .productListing-data, .accountQuantityDisplay, .ratingRow, LABEL#textAreaReviews, #productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .gvBal, .attribImg {
    text-align: center;
    }

    #bestsellers .wrapper {
    margin: 0em 0em 0em 1.5em;
    }

    #bestsellers ol {
    padding: 0;
    margin-left: 1.1em;
    }

    #bestsellers li {
    padding: 0;
    margin: 0.3em 0em 0.3em 0em;
    }

    #bannerboxHeading { background-color: #666 }

    #upProductsHeading {
    text-align: left;
    }

    #upDateHeading {
    text-align: right;
    }

    /* categories box parent and child categories */
    A.category-top, A.category-top:visited {
    color: #999999;
    text-decoration: none;
    }
    A.category-links, A.category-links:visited { color: #999999; text-decoration: none }
    A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited {
    color: #999999;
    text-decoration: none;
    }
    SPAN.category-subs-parent {
    font-weight: bold;
    }
    SPAN.category-subs-selected {
    font-weight: bold;
    }
    /* end categories box links */

    /*misc*/
    .back {
    float: left;
    }

    .forward {
    float: right;
    }

    .bold {
    font-weight: bold;
    }

    .rowOdd {
    background-color: #E8E8E8;
    height: 1.5em;
    vertical-align: top;
    }

    .rowEven {
    background-color: #F0F0F0;
    height: 1.5em;
    vertical-align: top;
    }

    CAPTION {
    /*display: none;*/
    }

    #myAccountGen li, #myAccountNotify li {
    margin: 0;
    }

    .accountTotalDisplay, .accountTaxDisplay {
    width: 20%;
    text-align: right;
    /*vertical-align: top*/
    }

    .accountQuantityDisplay {
    width: 10%;
    vertical-align: top
    }

    TR.tableHeading {
    background-color: #666666;
    height: 2em;
    }

    .productListing-rowheading {
    background-color: #999999;
    background-image: url(../images/tile_back.gif);
    height: 2em;
    color: #FFFFFF;
    }

    #siteMapList {
    width: 90%;
    float: right;
    }

    .ratingRow {
    margin: 1em 0em 1.5em 0em;
    }

    LABEL#textAreaReviews {
    font-weight: normal;
    margin: 1em 0em;
    }

    #popupShippingEstimator, #popupSearchHelp, #popupAdditionalImage, #popupImage, #popupCVVHelp, #popupCouponHelp, #popupAtrribsQuantityPricesHelp, #infoShoppingCart {
    background-color: #ffffff;
    }


    #siteinfoLegal, .legalCopyright {
    text-align: center;
    padding: 1em;
    background-color: #666666; /* change it to ur desired color */
    font-size: 10px;
    }


    .itemTitle {
    font-size: 16px;
    font-weight: bold;
    font-color: #666666;
    }

  2. #2
    Join Date
    Aug 2005
    Location
    Arizona
    Posts
    27,755
    Plugin Contributions
    9

    Default Re: Space between Header and Content Boxes

    Try separating and adding a height statement to your #headerWrapper and adjust the height similar to this
    Code:
    #headerWrapper {
    	margin: 0em;
    	padding-bottom: 0em;
            height: 130px;
    	}
    
    #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
    	margin: 0em;
    	padding-bottom: 0em;
    	}
    Zen-Venom Get Bitten

  3. #3
    Join Date
    Aug 2006
    Location
    Canada
    Posts
    1,029
    Plugin Contributions
    5

    Default Re: Space between Header and Content Boxes

    As well, in Firefox... your rounded corners up top are ruined from unused, but active h1 tags in your tagline wrapper. In your custom tpl_header.php, find;
    Code:
        <div id="taglineWrapper">
          <div id="tagline"><h1></h1></div>
        </div>
    Either omit the entire code above or at the very least, omit the h1 open and close tags(in red).

  4. #4
    Join Date
    Dec 2005
    Posts
    136
    Plugin Contributions
    0

    Idea or Suggestion Re: Space between Header and Content Boxes

    Gutchya...Thanks for the help

  5. #5
    Join Date
    Dec 2005
    Posts
    136
    Plugin Contributions
    0

    application error Re: Space between Header and Content Boxes

    hmmmm.... I tried what you said above, but it didn't seem to work. Also On Mac Browser, theres is a big gap from the top to the header....hmmm

 

 

Similar Threads

  1. ugly space between header and content
    By darth_oettinger in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 8 Jul 2009, 05:37 PM
  2. removing the space between sidebox header image and content
    By davowave in forum Templates, Stylesheets, Page Layout
    Replies: 7
    Last Post: 14 Mar 2009, 12:19 AM
  3. Need space between sideboxes and main content
    By Wstar in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 3 Dec 2008, 03:41 PM
  4. How do I *tighten up* the space between the header and the start of the content.
    By comicart in forum Templates, Stylesheets, Page Layout
    Replies: 4
    Last Post: 16 Sep 2008, 05:08 PM
  5. Need help adding space between my header and the center content.
    By Scrap-eze in forum Templates, Stylesheets, Page Layout
    Replies: 5
    Last Post: 20 Jan 2007, 03:22 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg