Closed
Bug 1106810
Opened 9 years ago
Closed 8 years ago
backcountry.com homepage and search results main content is not displayed
Categories
(Web Compatibility :: Site Reports, defect)
Tracking
(Not tracked)
RESOLVED
FIXED
People
(Reporter: nsm, Unassigned)
References
()
Details
(Whiteboard: [contactready] [css] [country-us])
Attachments
(5 files)
http://backcountry.com is a well known outdoor sports retailer. The main content (homepage screens) do not show up, just a white background. Similarly searching for products leads to search results leads to nothing. Headers and footers render.
Reporter | ||
Comment 1•9 years ago
|
||
Reporter | ||
Comment 2•9 years ago
|
||
Reporter | ||
Comment 3•9 years ago
|
||
Reporter | ||
Comment 4•9 years ago
|
||
Updated•9 years ago
|
Component: General → Mobile
Product: Firefox for Android → Tech Evangelism
Version: Firefox 34 → Trunk
Updated•9 years ago
|
Comment 5•9 years ago
|
||
The oddest thing is that if you open dev tools, find the <div class="body"> element and de-activate the "overflow:hidden" property inside the @media(max-width: 64em){} block, the page contents will appear..
Comment 6•9 years ago
|
||
(even though the "box model" tab for the div.body element confirms it's got reasonable dimensions, I see no obvious reason why the overflow:hidden should hide all the content inside it) Even with the overflow:hidden removed, it doesn't render perfectly - now the main header and search field disappears..
Comment 7•9 years ago
|
||
A possible workaround is finding the block @media (max-width:64em){ .head-mobile{ display:inline-block; vertical-align: middle; } } and adding float:none to those .head-mobile rules. I have no idea yet why this would solve the problem and whether it works for different resolutions..
Comment 8•9 years ago
|
||
This reminds me of bug 1073574. An element has float:left and width:100%. The next element also has width:100% but ends up being rendered to the right of the previous one, off-screen and hidden because of an overflow:hidden rule. Daniel, is this a duplicate?
Flags: needinfo?(dholbert)
Comment 9•9 years ago
|
||
Looks like it, yeah. At least, the workarounds described there in testcase 3 do also work on your testcase here. (those workarounds being: add a border, or set "overflow" on the parent of the floated element. In this case, that parent is the div with class="page ui-offcanvas-main".) So, this should probably be marked as a dupe, though if you think we should ask the site to implement a workaround, we could leave this open as a Tech Evang bug. (Unfortunately I don't know our float-handling code particularly well (I have the impression that it's somewhat fragile), so I don't know how hard bug 1073574 is to fix. It's useful to know that it's being hit by multiple real-world sites, though.)
Flags: needinfo?(dholbert)
Comment 10•9 years ago
|
||
Yes, let's contact them to recommend a workaround. I think the one in comment 7 is sensible and probably risk-free.
See Also: → 1073574
Whiteboard: [contactready] [css] [country-us]
Assignee | ||
Updated•5 years ago
|
Product: Tech Evangelism → Web Compatibility
Assignee | ||
Updated•21 days ago
|
Component: Mobile → Site Reports
You need to log in
before you can comment on or make changes to this bug.
Description
•