Widget block alignment

  • Resolved Z1gnol

    (@z1gnol)


    10 years, 11 months ago

    Hi,

    Please check http://www.forgingground.com

    The structure of the page is as following:

    Row 1, 50/50 split:
    a)content block left – content block right
    b)content block left – content block right

    This goes on for three more rows. The content blocks in b) contain facebook plugins. I want these to be aligned, but they dont, because the content blocks above it are not always of the same length.

    I have experimented with:
    -just adding the plugins within the a) blocks, add some blank rules, yet they don’t align then;
    -by putting the plugins in a separate row, but this breaks the responsive single column layout on a phone; the plugins will be grouped and the a) blocks will be grouped.

    Can anyone please point me to a solution? A simple html or css solution perhaps?

    Much appreciated!

    https://ww.wp.xz.cn/plugins/siteorigin-panels/

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support Andrew Misplon

    (@misplon)

    10 years, 11 months ago

    Hi @z1gnol

    I think we chatted on the SiteOrigin forums. I sent through a custom row class to turn off responsive for that row. I can’t seem to find the thread now. If that was you, please, post the link here in case someone else is interested in the answer.

    Thanks 🙂

    Plugin Support Andrew Misplon

    (@misplon)

    10 years, 11 months ago

    Here we go 🙂

    https://siteorigin.com/thread/pagebuilder-more-than-1-line-in-1-row-problem-on-mobile-phone/

    Thread Starter Z1gnol

    (@z1gnol)

    10 years, 11 months ago

    Hi Misplon,

    That wasn’t me on the SiteOrigin forums.

    I did fix it though and not by disabling responsiveness on the row. Wouldn’t want to break the mobile view ofcourse.

    My solution was as following: I put the text from the a) rows in a div, gave it a height property trough CSS, so left and right colums would be just as high, no matter the length of the text.

    This caused overlapping in mobile view, so I wrote a media querie to disable the height CSS in viewports lower than 800px.

    There is misalignment between 800px and 1000 px, but these resolutions are hardly used on tablets and phones upscale anyways.

    Plugin Support Andrew Misplon

    (@misplon)

    10 years, 11 months ago

    Thanks for sharing your fix, much appreciated! Really glad to hear you made progress on this.

    Cheers for now 🙂

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

The topic ‘Widget block alignment’ is closed to new replies.