Align Product Images to BOTTOM of Row on Shop page

  • Resolved Chi Is Current

    (@jacobbarnett)


    4 years, 7 months ago

    Hello ~

    I am looking for a way to align 4 images of different heights, to bottom of their row, above on SHOP page. They are currently aligned to the top of the row. The ideal solution would keep descriptions and buttons aligned, horizontally, leaving tops of images at different levels (ragged top).

    Many Thanks ~:~ Jacob

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Nico

    (@nicolamustone)

    Automattic Happiness Engineer

    Hello there,
    I tried aligning them via CSS but I was not able to.

    The best way to do this would be to simply upload the images that are all the same size, or prepare them before uploading so that this issue is resolved at the root.

    Thread Starter Chi Is Current

    (@jacobbarnett)

    Nicola ~

    Thank you for your reply.
    I thought of standardizing the image sizes, which I may have to do…
    I was intending to have 2 oz. bottles display as taller images than the 1 oz. bottles…

    Best Regards, Jacob

    Nico

    (@nicolamustone)

    Automattic Happiness Engineer

    Hi Jacob,
    It would make more sense for the bottle in the picture to be smaller/bigger if you want, but still have the same picture size.

    Thread Starter Chi Is Current

    (@jacobbarnett)

    Nicola ~

    Thank you for your reply.
    Alas, I think you are correct; though I wish I could find an alternate solution.
    In the mean time, I’ll revise those images.

    With Best Regards ~:~ Jacob

    Thread Starter Chi Is Current

    (@jacobbarnett)

    Nicola,

    It would make more sense for the bottle in the picture to be smaller/bigger if you want, but still have the same picture size.

    Thank you for your elegantly simple solution!
    By selecting standard ‘canvas’ sizes in Photoshop, and scaling images relatively, adding empty space at the tops of smaller images, I was able to create the desired effect.

    With Best Regards, Jacob

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Align Product Images to BOTTOM of Row on Shop page’ is closed to new replies.