[Webkit-unassigned] [Bug 150160] New: Hidden divs on grid based elements do not appear after first column

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=150160

            Bug ID: 150160
           Summary: Hidden divs on grid based elements do not appear after
                    first column
    Classification: Unclassified
           Product: WebKit
           Version: WebKit Nightly Build
          Hardware: All
                OS: Windows 7
            Status: NEW
          Severity: Major
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: maos_2001 at hotmail.com

Created attachment 263143
  --> https://bugs.webkit.org/attachment.cgi?id=263143&action=review
HTML and CSS coding for reference

When using a grid based layout for images, I have included a descriptive text div on each item which slides up when the user hovers over each individual image and slides back down when hover is removed. This works fine on the first column of images but on any other column the descriptive text div does not slide up, it appears the issue lies with either the -webkit-column-count or position:absolute; commands in CSS. 

When using the Inspect Element in Chrome the text divs are seen by the browser but the CSS is not taking effect. This affects both Chrome and Safari browsers.
The JSFiddle link below shows the issue in action - the first two images have the divs slide up but the other images do not even though every image has some sort of text div applied.

If the position:absolute is changed for position:static each text div is then placed under each image so Chrome is reading the HTML code correctly, but the slide transition simply does not work.
The other issue is the CSS has specific settings for mobile devices whereby the text divs are permanently displayed over each image but again only the first column is working any other columns are simply missed, I therefore have to change the setup of the page completely so that the grid system works across all browsers.

This setup works fine in IE and Firefox

http://jsfiddle.net/jbb5Ljwy/1

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.webkit.org/pipermail/webkit-unassigned/attachments/20151015/672c04df/attachment.html>