Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

In a grid, how can I align columns properly?

  • wordpressuser1

    My website’s top bar element is in a grid. I want the left column to be on the left, and right column to be on the right. When selecting the master setting, I can either align everything to the right, or to the left.

    On my website, I have aligned them all to the left, but as you can see in the screenshot (URL + screenshot attached in the Private Information area) it leads to the social media icons to not be on the left.

    In short, for the website in the Private Info area, how do I align these social media icons to the right in my current setup?

  • Hi there,

    I would use 2 columns, each with 50% width.

  • wordpressuser1

    I just tried it (it’s displayed under the previous grid) and as you can see, the social media buttons are displaying in the middle instead of on the right side. Also, the “Tablet” view is causing the social media buttons to display on top of the left column.

    In case it helps, I added the WP credentials to the Private Info area if it would help you see my setup and what I’m doing wrong.

    Thanks for any help

  • I mean using Grid block to have 2 columns, not using columns block.

    You just need to remove the center column of the current Grid, and set the other 2 columns to width 50%.

  • wordpressuser1

    done now, but the social media icons are still towards the middle. Can you please give me a detailed response of what settings I need to put on the columns to achieve the effect I want?

    I want the left column aligned left, and right column alight to the right, the image I attached showed it clearly…

    Thanks.

  • Can you disable your cache plugin? Some CSS of the blocks are missing.

    And your structure is too complicated, it should be simple as below:

    - Grid
      -- Container A (50% width)
        --- Headline
        --- Headline
      -- Container B (50% width)
        --- Button 
        --- Button 
        --- Button
  • wordpressuser1

    Thanks for the reply. I’ve simplified it as you suggested, and I’ve also disabled my cache plugin.

    The social media buttons are still displaying in the middle, this is killing me how can I align them to the right?

  • I’ve set the GB CSS print method to inline at dashboard > GenerateBlocks, now it regenerated CSS and the issue is fixed 🙂

    For more info about unstyled GB blocks issue, check this article:https://docs.generateblocks.com/article/unstyled-content/

  • wordpressuser1

    Hi Ying,

    Thank you so much it’s working!

    I’m hoping to get some more info on what you changed so that I know for the future – was it just that you changed the CSS print method away from “External File” to “Inline Embedding”? How does that help, was it just a cache problem? I saw External File is better performance so would I later be allowed to switch back to it?

    Thank you and sorry for the confusion about it

  • was it just that you changed the CSS print method away from “External File” to “Inline Embedding

    Yes, that’s it.

    How does that help, was it just a cache problem?

    It’s all explained in the article I attached in my previous reply 🙂

    I saw External File is better performance so would I later be allowed to switch back to it?

    You can try the solutions introduced in the article, but the snippet does not work, I’m afraid you will have to stick with inline CSS. But don’t worry, the impact on performance is minimal.

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.