Use hidden column’s space

  • ngc5128

    (@ngc5128)


    5 years, 8 months ago

    I have a row, and divided it into three columns evenly (1/3 +1/3 + 1/3).

    ——–|——–|————
    Image | Data | Delivery Info
    ——–|——–|————-

    When I shrink the browser’s window, the Delivery Info column will be hidden for all of the devices (expect PCs). But What I want is to use it’s space for Image and Data columns and re-distribute the total width like 35% for Image and 65% for the Data column.

    Breaking the Delivery column below and centering it would be nice, but its not important, what is important is how can I reuse it’s space after being hid?

    • This topic was modified 5 years, 8 months ago by ngc5128.
Viewing 1 replies (of 1 total)
  • George Appiah

    (@gappiah)

    5 years, 8 months ago

    What you’re describing here is a basic responsive column layout.

    If you’re using WordPress’ default “Gutenberg” editor, the built-in COLUMNS block already does this automatically (it even does your “nice to have” feature) — just create your columns and add your content, you don’t need to do anything else.

    If you’re writing custom HTML/CSS, take a look at this CSS Tricks article for guidance: https://css-tricks.com/guide-responsive-friendly-css-columns/

    And if you’re using some other plugin or page builder to create these columns, then you’ll need to consult the documentation of that specific plugin or contact the developer for support.

    Good luck.

Viewing 1 replies (of 1 total)

The topic ‘Use hidden column’s space’ is closed to new replies.

Tags