NO BUG: iOS26 Padding Issue For Paragraph Modules

Bugs
1

I am having a new issue for devices on iOS26.

  • Bricks 2.0.1 (also upgraded to 2.0.2 but the issue did not resolve).
  • I am also using ACSS.

On mobile, my site is adding right padding for all paragraph text modules. I do not see anything in the CSS that is causing the issue. The bricks builder renders correctly as does the mobile preview when inspecting the pages. I was able to inspect/debug using a mac and connecting my phone, but still was unable to determine the cause.

I tested the site on two other iPhones not on iOS26 and both do not have the issue.

Is anyone else experiencing this?

I have attached two images to show the issue. I have highlight the area in yellow on the image titled iOS 26 Padding Issue

iOS 26 Padding Issue.PNG
iOS 26 Padding Issue.PNG1179×2556 229 KB

Non iOS 26 Renders Correctly.PNG
Non iOS 26 Renders Correctly.PNG1284×2778 285 KB

2

Hi,
Thanks so much for your report, and welcome to the forum!

My iPhone is currently updating, but that’s obviously a Webkit issue introduced by iOS 26, as they added text-wrap: pretty support, see:

How this feature is implemented or designed in Webkit/iOS is far beyond our reach :smiley:

Best regards,
timmse

3

This is it! Thanks for the tip.

This css code fixes the issue:

/* iOS Safari only, phones and tablets */
/* Disables the new pretty wrapping that WebKit just enabled */
@supports (text-wrap: pretty) and (-webkit-touch-callout: none) {
  @media (max-width: 1024px) {
    /* Global reset for body copy */
    body,
    p,
    li,
    .brxe-text,
    .brxe-rich-text {
      text-wrap: wrap !important;        /* use normal wrapping */
    }

    /* Keep balanced headings if you use them */
    h1, h2, h3, h4, h5, h6 {
      text-wrap: balance;                 /* optional, keep nice titles */
    }
  }
}
1 Like