Results 1 to 5 of 5
  1. #1
    Join Date
    May 2008
    Location
    Mount Colah, NSW, Australia
    Posts
    48
    Plugin Contributions
    0

    Default Price Alignment - Help! Please

    Can anyone tell me how to move the price either down a fraction or alternatively move the price under the product heading.

    You can see the problem if you click the following link

    http://http://www.youchoosegifts.com.au/index.php?main_page=index&cPath=13

    The price looks like it belongs to the product above not below which is very confusing.

    I wasn't sure if this should be posted under style sheets, layout changes or this category so sorry if its in the wrong place.

    Thanks in advance for your help.

    Christina

  2. #2
    Join Date
    Sep 2006
    Posts
    542
    Plugin Contributions
    0

    Default Re: Price Alignment - Help! Please

    find this in your stylesheet

    .productListing-data,.itemTitle{
    text-align: left;
    }

    and change to this

    .productListing-data{
    padding-top: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #cacaca;
    }

    .itemTitle{
    text-align: left;
    }
    Play with the padding top and bottom until you adjust your rows right and the boder bottom adds a border between each listing.

  3. #3
    Join Date
    May 2008
    Location
    Mount Colah, NSW, Australia
    Posts
    48
    Plugin Contributions
    0

    Default Re: Price Alignment - Help! Please

    Quote Originally Posted by usernamenone View Post
    find this in your stylesheet

    .productListing-data,.itemTitle{
    text-align: left;
    }

    and change to this

    .productListing-data{
    padding-top: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #cacaca;
    }

    .itemTitle{
    text-align: left;
    }
    Play with the padding top and bottom until you adjust your rows right and the boder bottom adds a border between each listing.
    I couldn't actually find this code in my css. See below;

    /**
    * 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 5349 2006-12-22 20:34:40Z birdbrain $
    */

    body {
    margin: 0;
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 62.5%;
    color: #152867;
    background-color: #152867;
    text-align : center;
    }

    a img {border: none; }

    a:link, #navEZPagesTOC ul li a {
    color: #3300FF;
    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: #FF0000;
    }

    a:active {
    color: #0000FF;
    }

    h1 {
    font-size: 1.5em;
    color: #152867;
    }

    h2 {
    font-size: 1.4em;
    }

    h3 {
    font-size: 1.3em;
    color: #ffffff;
    }

    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 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: 85%;
    }

    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: 70%;
    vertical-align: top;
    border: 1px solid #9a9a9a;
    }

    #headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
    margin: 0em;
    padding: 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:#152867;
    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, #navCatTabsWrapper {
    margin: 0em;
    background-color: #abbbd3;
    background-image: url(../images/tile_back.gif);
    padding: 0.5em 0.2em;
    font-weight: bold;
    color: #ffffff;
    height: 1%;
    }

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

    #navCatTabs ul li a {
    color: #9a9a9a;
    }

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

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

    #navMainSearch {
    float: right;
    }

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

    #navEZPagesTop {
    background-color: #abbbd3;
    background-image: url(../images/tile_back.gif);
    font-size: 0.95em;
    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 {
    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 #000000;
    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: #ffffff;
    }

    /*sideboxes*/
    .columnLeft {}

    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.9em;
    color: #ffffff;
    }

    .leftBoxHeading, .centerBoxHeading, .rightBoxHeading {
    margin: 0em;
    background-color: #abbbd3;
    background-image: url(../images/tile_back.gif);
    padding: 0.5em 0.2em;
    }

    .leftBoxContainer, .rightBoxContainer {
    margin: 0em;
    border: 1px solid #9a9a9a;
    border-bottom: 5px solid #336633;
    margin-top: 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;
    }

    and replace it with this
    .bestsellers_thumbnail {
    width: 26px;
    padding-right: 4px;
    float: left;
    margin: 0px;
    }
    #bestsellers .wrapper {
    margin: 0em 0em 0em 0.9em;
    }
    #bestsellers ol {
    padding: 0;
    margin-left: 1.1em;
    }
    #bestsellers li {
    margin-left: 3px;
    padding-top: 5px;
    margin: 0em 0em 1.3em 0em;
    clear: both;
    }

    #bannerboxHeading {
    background-color: #0000CC;
    }

    #upProductsHeading {
    text-align: left;
    }

    #upDateHeading {
    text-align: right;
    }

    /* categories box parent and child categories */
    A.category-top, A.category-top:visited {
    color: #152867;
    text-decoration: none;
    }
    A.category-links, A.category-links:visited {
    color: #004080;
    text-decoration: none;
    }
    A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited {
    color: #FF0000;
    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, #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;
    }

    .productListing-rowheading {
    background-color: #abbbd3;
    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;


    }

    #navCurrenciesWrapper a {
    color: #ffffff;
    text-decoration: none;
    }

    #navCurrenciesWrapper a:hover {
    color: #000000;
    text-decoration: none;
    }




    Appreciate your help with this. Thanks

  4. #4
    Join Date
    Feb 2005
    Location
    Lansing, Michigan USA
    Posts
    20,021
    Plugin Contributions
    3

    Default Re: Price Alignment - Help! Please

    Any time you get a suggestion to 'find this in your stylesheet', and it isn't there, feel free to add it yourself.

    Most of the time, adding the element to the end of the stylesheet works fine.

  5. #5
    Join Date
    May 2008
    Location
    Mount Colah, NSW, Australia
    Posts
    48
    Plugin Contributions
    0

    Default Re: Price Alignment - Help! Please

    That's really handy to know.

    I've simply added the suggested code, played around with the padding and it works great.

    Just incase anyone wants to know what changes I made see below.

    .productListing-data{
    padding-top: 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid #cacaca;
    }

    .itemTitle{
    text-align: center;
    }

    Thanks
    Christina


 

 

Similar Threads

  1. Alignment problem please help!
    By cs_jono in forum Templates, Stylesheets, Page Layout
    Replies: 8
    Last Post: 16 Apr 2010, 06:51 PM
  2. Help Please on Alignment and Colors
    By deesan in forum Templates, Stylesheets, Page Layout
    Replies: 1
    Last Post: 21 Jun 2008, 04:24 PM
  3. Please help: Firefox alignment Issue
    By Cliveo in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 17 Jun 2008, 10:51 PM
  4. Please help: IE and Firefox alignment problems
    By james739 in forum Templates, Stylesheets, Page Layout
    Replies: 4
    Last Post: 13 Oct 2007, 08:11 PM
  5. alignment problem... please help me.
    By cplam999 in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 12 Jun 2006, 09:54 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