Twenty Twenty: Customizer widgets' edit buttons are partially obstructed on smaller screens

[sumitsingh]

Hi,

Design issue in customize.php on Twenty Twenty theme.

For more information sees mention screenshot.

Thanks

[sumitsingh]

Bug screenshot file

[sumitsingh]

I have also a solution. changed width: calc(100% - 4rem); to width: calc(100% - 8rem); in wp-content/themes/twentytwenty/style.css

.section-inner {

margin-left: auto;
margin-right: auto;
max-width: 120rem;
width: calc(100% - 8rem);

}

[sabernhardt]

Twenty Twenty at iPad size with adjustment to section-inner class width

[sabernhardt]

Related: #46969 shows the same issue in Twenty Nineteen, and buttons can be cut off even more in Twenty Twenty-One. Ideally, this could be fixed in the Customizer, though I'm not convinced it can.

Twenty Fourteen and Twenty Seventeen already adjust the site title and/or edit buttons.

So 49008.patch​ reduces the width of Twenty Twenty's section-inner class in the Customizer to make space for the footer widgets' Edit buttons, as recommended above.

[sumitsingh]

Hi Guys,

Any update about this things?

[sabernhardt]

only applies reduced width to the footer nav/widgets container

[sabernhardt]

The first patch had affected some elements within the content area (on a home page of posts). The revised patch targets only the container for footer navigation and widgets.