Image Gets Squooshed in Container

  • Resolved dukearmi

    (@dukearmi)


    6 months ago

    This must has a simple solution, but I can’t figure it out. I have a simple grid on my homepage with a heading and paragraph on the left and image on the right. I want them centered within the container (and they are). I also want the heading and the paragraph to each display in one line (done). But the image isn’t displaying at 256px wide as intended, it gets a little tinier (~242px wide). How do I make sure it displays at 256px?

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

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

    (@alvindcaesar)

    Hi there,

    You can try adjusting the size of the container that wraps the image block to 256px.

    Thread Starter dukearmi

    (@dukearmi)

    Hi Alvind,

    It would work except that the grid containers are split into 65% and 35% (for the image).

    • This reply was modified 6 months ago by dukearmi.
    David

    (@diggeddy)

    Hi there,

    don’t use a Grid Block. Instead build a Flex Row. The layout would be like so:

    Container Block #1
---- Container Block #2 for the text
---- Container Block #3 for the image

    Container Block #1
    Set the Layout > Display to Flex, and the Flex Wrap to Wrap

    Container Block #2
    Set the Layout > Flex Child -> Flex Grow to 1

    Container Block #3
    Set the Layout > Flex Child -> Grow to 0 Shrink to 0 and Basis to 256px

    Thread Starter dukearmi

    (@dukearmi)

    Thank you, David. Perfect. This feels like finding gold or something. Awesome feature ??

    David

    (@diggeddy)

    Glad to be of help ??

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Image Gets Squooshed in Container’ is closed to new replies.