www.graficasolution.com - "Nos projets" section layout is broken

[webcompat-bot]

URL: https://www.graficasolution.com/

Browser / Version: Firefox 94.0
Operating System: Windows 10
Tested Another Browser: Yes Chrome

Problem type: Design is broken
Description: Items are misaligned
Steps to Reproduce:
The project section is misaligned and images are not showing

View the screenshot

Browser Configuration

• None

From webcompat.com with ❤️

[softvision-oana-arbuzov]

Thanks for the report, I was able to reproduce the issue. "Nos projets" section layout is broken.

Note: The issue is not reproducible on Chrome.

Workaround: Resizing the windows the content is displayed correctly.

Tested with:
Browser / Version: Firefox Nightly 96.0a1 (2021-12-04), Firefox Release 94.0.2
Operating System: Windows 10 Pro

Moving to Needsdiagnosis for further investigation.

[karlcow]

The design changes when the window is above or under 992px.

And indeed in

@media (min-width:992px) {

// set of rules defined in percentages.
// specifically 

}

but more specifically this rule:

.container-fluid .boldgrid-section, .container-fluid .boldgrid-section-group, .container-fluid .row, .container .row {
	margin-right: -15px;
	margin-left: -15px;
}

which comes from a bootstrap issue relying on a Blink and WebKit bug.
twbs/bootstrap#35277
https://bugs.chromium.org/p/chromium/issues/detail?id=1141209
https://bugs.webkit.org/show_bug.cgi?id=233956

It can be solved by adding to the CSS.

@media (min-width:992px) {
 .container {
  width:970px
 }
  .container .row.multi-columns-row {
    width: fit-content;
  } 
}

[webcompat-bot]

Generate outreach template

[dholbert]

I've landed a patch that fixes this issue in https://bugzilla.mozilla.org/show_bug.cgi?id=1745310 .

I've confirmed that this webcompat issue is still reproducible in Firefox 100, and is fixed in latest Firefox Nightly 102.

[softvision-raul-bucata]

The issue has been fixed and it is no longer reproducible:

Tested with:

Browser / Version: Firefox Nightly 106.0a1 (2022-09-08) (64-bit)
Operating System: Windows 10 PRO x64

Closing this as FIXED

[inv_36/2022]