Fluid design / clearing wrapper

[frobernik]

Bug Report

What is the issue?

We've built a fluid design for one of our pages but theres an issue where one of the panels isn't being wrapped around by the 'nhsuk-main-wrapper' container div.

What steps are required to reproduce the issue?

Build a page with a fluid layout or make a panel/div with float:left or float:right and with no clearing CSS.

What was the environment where this issue occurred?

• Device: Macbook Pro 15
• Operating System: macOS Monteray 12.0.1
• Browser: Google Chrome
• Browser version: 96.0.4664.55 (Official Build) (x86_64)

Is there anything else you think would be useful in recreating the issue?

Above is an example of what we're seeing

[henocookie]

@davidhunter08 thinks that applying the utility class nhsuk-u-clear to the containing div (panel) might solve the issue: https://github.com/nhsuk/nhsuk-frontend/blob/master/packages/core/utilities/_clearfix.scss

@frobernik could you try this and share if it solves the issue?

[frobernik]

@davidhunter08 thinks that applying the utility class nhsuk-u-clear to the containing div (panel) might solve the issue: https://github.com/nhsuk/nhsuk-frontend/blob/master/packages/core/utilities/_clearfix.scss

@frobernik could you try this and share if it solves the issue?

Yes worked thanks 👍