Announcement

Collapse
No announcement yet.

CTGY Product Listing Page Layout Issues--Text Cutoff

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    CTGY Product Listing Page Layout Issues--Text Cutoff

    In the grid on some of my CTGY products listing pages, if the thumbnail image is extra high in the
    vertical dimension (depends on the product) compared to other images, it will push the
    Price and Quantity in Basket text down and behind white space surrounding the Add to Basket
    button. I've tried to enlarge the height dimension of each container in the grid using CSS but
    have been unsuccesful. How can I do this without having to resize my thumbnail images?

    #2
    Re: CTGY Product Listing Page Layout Issues--Text Cutoff

    You can either specify a large enough height on the product's containing css or try clearing with css on the price. I am one for consistency though, so it will look best if all of your images are the same height and width, which can eliminate any need to adjust the css. Otherwise, the height will make all product containers the same height with some product's containers being too large for the content, and ditto for the clearing.

    Hope this helps.

    Jamie
    Jamie Donaldson
    JSDVS Web Design / Development
    Web Design | Web Development | E-commerce Design & Integration

    Comment


      #3
      Re: CTGY Product Listing Page Layout Issues--Text Cutoff

      Any suggestions for a row of images of different width. I would like the margin/padding to be equal between images. Right now they are different.

      http://ravenmaps.mivamerchant.net/mm...Code=US-States

      Thanks
      Doak Heggeness
      Web Developer | Certified Miva Merchant Developer

      Comment


        #4
        Re: CTGY Product Listing Page Layout Issues--Text Cutoff

        One thing I always recommend is re-sizing images so that they are all the same width and height. If an image cannot be re-sized feasibly, create a background for the image within a photo editor;otherwise, set your height and width on the image's containing class and put a background color in the css. I prefer the css. Also, background color isn't necessary, but that will give it definition, and appear as if all images are evenly spaced.

        But...same width and height is always best.

        Jamie
        Jamie Donaldson
        JSDVS Web Design / Development
        Web Design | Web Development | E-commerce Design & Integration

        Comment


          #5
          Re: CTGY Product Listing Page Layout Issues--Text Cutoff

          I see , take your widest image and set your container for that and any smaller images will have background in css.
          Doak Heggeness
          Web Developer | Certified Miva Merchant Developer

          Comment

          Working...
          X