Query Items Not Aligned

  • intuitiveetraveler

    (@intuitiveetraveler)


    2 years, 1 month ago

    Each blog post in the North America query loop sits at a different position. Can someone help me get them even?

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • David

    (@diggeddy)

    2 years, 1 month ago

    Hi there,

    if you need alignment, then you have very limited options and control.

    My suggestion with the core Query Loop Block is:

    1. Move the Image above the Title.
    2. Add the following CSS:
    .wp-block-query > ul > li {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.wp-block-query .wp-block-separator {
    margin-top: auto;
}

    The images being the same size will now align, the separator will be pushed down to align at the bottom, and the variable length text blocks will fill whatever space they can.

    Thread Starter intuitiveetraveler

    (@intuitiveetraveler)

    2 years, 1 month ago

    Where do I add the CSS?

    Leo

    (@leohsiang)

    2 years, 1 month ago

    Learn how to add CSS: https://docs.generatepress.com/article/adding-css/

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Query Items Not Aligned’ is closed to new replies.