[Webkit-unassigned] [Bug 140542] New: ::first-line skips out-of-flow elements but doesn't affect the next block

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Fri Jan 16 03:38:18 PST 2015


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

            Bug ID: 140542
           Summary: ::first-line skips out-of-flow elements but doesn't
                    affect the next block
    Classification: Unclassified
           Product: WebKit
           Version: 528+ (Nightly build)
          Hardware: Unspecified
                OS: Unspecified
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: rego at igalia.com
        Depends on: 140541

Created attachment 244759
  --> https://bugs.webkit.org/attachment.cgi?id=244759&action=review
Example to reproduce the issue

First bug #140541 should be fixed, but this issue was present before (Safari 7) and it's still present in Blink (https://code.google.com/p/chromium/issues/detail?id=449475).

Example (attached) to reproduce the issue ("Green" should be green and "Black" should be black):
<style>
    .first-line-green::first-line {
        color: lime;
    }

    .float {
        float: left;
    }
</style>
<div class="first-line-green">
    <div class="float">
        Black
    </div>
    <div>Green</div>
</div>

In the example the text "Green" appears in black.

Once bug #140541 is fixed, this problem might be probably because of "::first-line" skips the floated element as expected, but it doesn't select the "Green" text because of it's not the first child.
Probably it's due to the condition "parentBlock->firstChild() != firstLineBlock" in RenderBlock::firstLineBlock() (but if you remove this condition other simple cases will fail):
    if (firstLineBlock->isReplaced() || firstLineBlock->isFloating()
        || !parentBlock || parentBlock->firstChild() != firstLineBlock || !isRenderBlockFlowOrRenderButton(*parentBlock))
        break;

However, if you remove the "<div>" wrapping "Green" it worked as expected (once bug #140541 is fixed it'll work as expected):
<style>
    .first-line-green::first-line {
        color: lime;
    }

    .float {
        float: left;
    }
</style>
<div class="first-line-green">
    <div class="float">
        Black
    </div>
    Green
</div>

BTW, the same happens if you use a positioned element.

>From the spec (http://www.w3.org/TR/css3-selectors/#first-formatted-line):
"The first formatted line of an element may occur inside a block-level descendant in the same flow (i.e., a block-level descendant that is not out-of-flow due to floating or positioning). For example, the first line of the DIV in <DIV><P>This line...</P></DIV> is the first line of the P (assuming that both P and DIV are block-level)."

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20150116/931a22cc/attachment-0001.html>


More information about the webkit-unassigned mailing list