Results 1 to 5 of 5
  1. #1
    Join Date
    Nov 2007
    Posts
    23
    Plugin Contributions
    0

    Default Header Customization

    There are lots of threads on this topic, but I can't seem to adapt any of the answers to my site. I would like the header navigation bar links to be over the top of my logo. I have one image that is as wide as the entire page. That file is set as the background-image under the logoWrapper in my stylesheet. I then created a continuation of the logo to be the background image for the navMainWrapper in my stylesheet. It looks good in Safari but not in FireFox. Can anyone suggest anything?

    Thank you in advance.

    my url is http://www.pragomatic.com

  2. #2
    Join Date
    Apr 2006
    Location
    London, UK
    Posts
    10,569
    Plugin Contributions
    25

    Default Re: Header Customization

    I'm looking at your site in Firefox, but can't see what you consider to be wrong. It looks fine to me.
    Kuroi Web Design and Development | Twitter

    (Questions answered in the forum only - so that any forum member can benefit - not by personal message)

  3. #3
    Join Date
    Nov 2007
    Posts
    23
    Plugin Contributions
    0

    Default Re: Header Customization

    Yeah, I don't see it now either. There were two grey bands, maybe 1 or 2 px that ran horizontal underneath the links in the main navigation bar. Thank you for looking. Is the way I went about that an efficient way to create that effect?

    Thank you!

  4. #4
    Join Date
    Apr 2006
    Location
    London, UK
    Posts
    10,569
    Plugin Contributions
    25

    Default Re: Header Customization

    It's not a bad way, but I'd probably have created one image and used it as the background for the whole header wrapper.
    Kuroi Web Design and Development | Twitter

    (Questions answered in the forum only - so that any forum member can benefit - not by personal message)

  5. #5
    Join Date
    May 2008
    Location
    Amarillo, TX
    Posts
    40
    Plugin Contributions
    0

    red flag Re: Header Customization

    1st of all I hope I am posting this in the right spot, if not please don't shoot me. I am already frustrated due to not being able to find what I am looking for.

    I'm trying to change the font in the center boxes to white and put a navy blue border around the center boxes as well, but can't seem to find out how to do this.

    Can someone please help. Thanks.

    my css is below

    /**
    * Main CSS Stylesheet
    *
    * @package templateSystem
    * @copyright Copyright 2003-2007 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 5952 2007-03-03 06:18:46Z drbyte $
    */

    body {
    margin: 0;
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 62.5%;
    color: #000080;
    background-color: #C0C0C0;
    }

    a img {border: none; }

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

    a:visited {
    color: #3300FF;
    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: #A9A9A9;
    }

    a:active {
    color: #0000FF;
    }

    h1 {
    font-size: 1.5em;
    }

    h2 {
    font-size: 1.4em;
    }

    h3 {
    font-size: 1.3em;
    }

    h4, h5, h6, LABEL, h4.optionName, LEGEND, ADDRESS, .sideBoxContent, .larger{
    font-size: 1.1em;
    }

    .biggerText {
    font-size: 1.2em;
    }

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

    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: #F0F8FF;
    }

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

    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;
    }

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

    #logo {float: left;}

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

    LABEL.inputLabelPayment {
    width: 15em;
    float: left;
    }

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

    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 #000080;
    }

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

    .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: 760px;
    vertical-align: top;
    border-top: 1px solid #000080;
    border-bottom: 1px solid #000080;
    border-left: 1px solid #000080;
    border-right: 1px solid #000080;
    }

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

    #navColumnOneWrapper, #navColumnTwoWrapper, #mainWrapper {
    margin: auto;
    }

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

    #sendSpendWrapper {
    border: 1px solid #000080;
    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, #navCatTabsWrapper {
    margin: 0em;
    background-color: #000080;
    font-weight: bold;
    color: #FFFFFF;
    height: 1%;
    width: 100%;
    }

    #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 {
    text-decoration: none;
    padding: 0em 0.5em;
    margin: 0;
    color: #FFFFFF;
    white-space: nowrap;
    }

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

    #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;
    }

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

    #navMainSearch {
    float: right;
    }

    #navBreadCrumb {
    background-color: #ffffff;
    }

    #navEZPagesTop {
    background-color: #E6E6FA;
    border-bottom: 1px solid #000080;
    }

    #navBreadCrumb, #navEZPagesTop {
    font-size: 0.95em;
    font-weight: bold;
    margin: 0em;
    padding: 0.5em;
    }

    #navColumnOne {
    background-color: #FFFFFF;
    }

    #navColumnTwo {
    background-color: #FFFFFF;
    }


    /*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 {
    padding: 0.8em;
    }

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

    /*Shopping Cart Display*/
    #cartAdd {
    float: right;
    text-align: center;
    margin: 1em;
    border: 1px solid #000080;
    padding: 1em;
    }

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

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

    #cartSubTotal {
    border-top: 1px solid #000080;
    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;
    }
    .mediaTitle {
    float: left;
    }
    .mediaTypeLink {
    float: right;
    }

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

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

    .orderHistList {
    margin: 1em;
    padding: 0.2em 0em;
    }

    #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;
    }

    /*sideboxes*/
    .columnLeft {}

    h3.leftBoxHeading, h3.leftBoxHeading a {
    font-size: 1em;
    color: #ffffff;
    }

    .leftBoxHeading {
    margin: 0em;
    background-color: #000080;
    padding: 0.5em 0.2em;
    }

    .centerBoxHeading {
    margin: 0em;
    background-color: #000080;
    padding: 0.5em 0.2em;
    }

    .leftBoxContainer {
    margin: 0em;
    border-top: 1px solid #000080;
    border-bottom: 1px solid #000080;
    border-right: 1px solid #000080;
    margin-top: 1.5em;
    }

    .rightBoxContainer {
    margin: 0em;
    border-top: 1px solid #000080;
    border-bottom: 1px solid #000080;
    border-left: 1px solid #000080;
    margin-top: 1.5em;
    }

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

    h3.rightBoxHeading, h3.rightBoxHeading a {
    font-size: 1.1em;
    color: #ffffff;
    }

    .rightBoxHeading {
    margin: 0em;
    background-color: #000080;
    padding: 0.5em 0.2em;
    }

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

    h3.rightBoxHeading a:hover {
    color: #FF0000;
    text-decoration: none;
    }

    .rightBoxContent {
    background-color: #ffffff;
    margin-bottom: 1em;
    }

    .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: #0000CC;
    }

    #upProductsHeading {
    text-align: left;
    }

    #upDateHeading {
    text-align: right;
    }

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

    .forward, #shoppingCartDefault #PPECbutton {
    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;
    }

    .hiddenField {
    display: none;
    }
    .visibleField {
    display: inline;
    }

    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: #cacaca;
    height: 2em;
    }

    #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;
    }
    .information {padding: 10px 3px; line-height: 150%;}

    #shoppingcartBody #shippingEstimatorContent {
    clear: both;
    }

    .seDisplayedAddressLabel {
    background-color:#85C285;
    text-align: center;
    }
    .seDisplayedAddressInfo {
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    }
    #seShipTo {
    padding: 0.2em;
    }


    ehswift

 

 

Similar Threads

  1. header customization - need help
    By GoldBuckle in forum Templates, Stylesheets, Page Layout
    Replies: 4
    Last Post: 6 Aug 2010, 07:20 PM
  2. Header customization quirks
    By tiffanyhunter2009 in forum Templates, Stylesheets, Page Layout
    Replies: 16
    Last Post: 18 Jun 2010, 07:21 PM
  3. Header customization
    By greatlakesherbalife in forum Templates, Stylesheets, Page Layout
    Replies: 3
    Last Post: 22 Apr 2010, 12:35 PM
  4. css flyout header stylesheet customization
    By kbalona in forum Templates, Stylesheets, Page Layout
    Replies: 7
    Last Post: 8 Jun 2007, 12:25 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