• Resolved Bloke

    (@bloke)


    I created a page entirely of blocks. I used a couple different plugin blocks. It looks ok in the editor, in Chrome and Edge. But when I view it in Firefox all my sections are distorted and stretched across the screen. I cleared Firefox cache. Is there any known issues with Firefox?

    • This topic was modified 3 years, 4 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Developing with WordPress topic
Viewing 3 replies - 1 through 3 (of 3 total)
  • Any change we can see the page in question and test for you.

    I understand if you can’t share your site address, but then there’s not a whole lot we can do to help you.

    Good luck!

    Thread Starter Bloke

    (@bloke)

    I think I figured out the issue. I wasn’t using sections. Just putting blocks one below each other. I set them all to full size but Firefox didn’t like that and made them thousands of pixels wide and off the page.

    I tried two approaches. First I made one large section and set the width to 1530 pixels and put all blocks inside.

    Then the other approach was have 4 sections down the page set to 1530 pixels wide. And put the blocks inside each one. So I guess you need a set width.

    I was really wanting to fill the screen with no margins.

    Thread Starter Bloke

    (@bloke)

    I found this to work after trying different templates and settings inside the editor. Also putting all my groups and settings into one large section didn’t change the results.
    How to Style Wide & Full-Width Gutenberg Blocks in WordPress
    add_theme_support( 'align-wide' );

    @media screen and (min-width: 960px) {
         .alignwide, .alignfull {
              width:  100vw;
              max-width:  100vw;
              margin-left:  calc(50% - 50vw);
         }
    }
    body {
         overflow-x:  hidden;
    }
    
    
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Gutenburg Blocks not displaying in Firefox’ is closed to new replies.