[creepingfilm]

Hi, I recently created this site. http://thecreeping.com/ Everything is looking and working great except one page when viewed on a Mobile. Here’s the page: http://thecreeping.com/full-credits/

When holding the phone horizontally it looks great but holding it vertically makes all the alignment mess up. I’m using an iPhone 8Plus and I’ve looked at it on Chrome and Safari. Any help much appreciated. Thanks.

Website: thecreeping.com/full-credits

[creepingfilm]

I recently created this site. http://thecreeping.com/ Everything is looking and working great except one page when viewed on a Mobile. Here’s the page: http://thecreeping.com/full-credits/

When holding the phone horizontally it looks great but holding it vertically makes all the alignment mess up. I’m using an iPhone 8Plus and I’ve looked at it on Chrome and Safari. Any help much appreciated.

[Zed]

Hi,

The columns block isn’t expected to be used quite in the fashion you are using it so it’s designed to re-arrange itself on the smaller screens.
Apply the following CSS to force its desktop layout for all screen sizes (on that specific page only):

.page-id-395 .wp-block-column.is-vertically-aligned-top {
    flex-basis: calc(50% - 1em) !important;
}
.page-id-395 .wp-block-column:nth-child(2n) {
    margin-left: 2em;
}

---

If you like our creations, help us share by rating them on WordPress.org.
Please check the available documentation and search the forums before starting a topic.

[Author]

Posts