The exact rendering is ill-spec'd. Some things are ugly (especially the
width and height of list style images) but they are infrequently used
and I believe this implementation matches the spec. Numeric lists are
not supported yet, since they will require a separate layout pass.
The implementation is a subclass of `BlockFlow`, on advice from Robert
O'Callahan.
This property is used by approximately 55% of page loads.
To implement the line breaking behavior, the "breaking strategy" has
been cleaned up and abstracted. This should allow us to easily support
other similar properties in the future, such as `text-overflow` and
`word-break`.
This assumes that there are no ligatures that span across multiple
words. Since we have a per-word shape cache, this is a safe assumption
as of now. I have left comments to ensure that, if and when this is
revisted, we make sure to handle it properly.
I had to use a somewhat unconventional method of computing text
indentation (propagating from blocks down to inlines) because of the way
containing blocks are handled in Servo.
(As a side note, neither Gecko nor WebKit correctly handles percentages
in `text-align`, at least incrementally -- i.e. when the percentages are
relative to the viewport and the viewport is resized.)
The ligature disabling code has been manually verified, but I was unable
to reftest it. (The only way I could think of would be to create an
Ahem-like font with a ligature table, but that would be an awful lot of
work.)
Near as I can tell, the method used to apply the spacing (manually
inserting extra advance post-shaping) matches Gecko.
This works on my simple test page https://people.mozilla.org/~mwu/rem.html , hopefully works on real pages too. Seems a little messy to add root_font_size directly to ComputedValues, but it didn't seem appropriate to add to the style structs.
`invert` is not yet supported.
Objects that get layers will not yet display outlines properly. This is
because our overflow calculation doesn't take styles into account and
because layers are always anchored to the top left of the border box.
Since fixing this is work that is not related to outline *per se* I'm
leaving that to a followup and making a note in the code.
The Unicode awareness of `text-transform` is implemented as well as
possible given the Rust standard library's Unicode support. In
particular, the notion of an alphabetic character is used instead of a
letter.
Gecko has a subclass of text run to handle text transforms, but I
implemented this in a simpler way.
This adds the infrastructure necessary to support stacking contexts that
are not containing blocks for absolutely-positioned elements. Our
infrastructure did not support that before. This minor revamp actually
ended up simplifying the logic around display list building and
stacking-relative position computation for absolutely-positioned flows,
which was nice.
This patch is a first stab at implementing border-radius. It looks fine as long as
the border isn't an ellipse (that might not even parse yet), and the border-widths
around a border-radius are the same.
Here's a cool screenshot!
r? @pcwalton @SimonSapin
matching, and use it for `<input size>` and `<td width>`.
This implements a general framework for legacy presentational attributes
to the DOM and style calculation, so that adding more of them later will
be straightforward.
absolutely-positioned elements declared with `display: inline`.
Although the computed `display` property of elements with `position:
absolute` is `block`, `position: absolute; display: inline` can still
behave differently from `position: absolute; display: block`. This is
because the hypothetical box for `position: absolute` can be at the
position it would have been if it had `display: inline`. CSS 2.1 §
10.3.7 describes this case in a parenthetical:
"The static-position containing block is the containing block of a
hypothetical box that would have been the first box of the element if
its specified 'position' value had been 'static' and its specified
'float' had been 'none'. (Note that due to the rules in section 9.7 this
hypothetical calculation might require also assuming a different
computed value for 'display'.)"
To handle this, I had to change both style computation and layout. For
the former, I added an internal property
`-servo-display-for-hypothetical-box`, which stores the `display` value
supplied by the author, before the computed value is calculated. Flow
construction now uses this value.
As for layout, implementing the proper behavior is tricky because the
position of an inline fragment in the inline direction cannot be
determined until height assignment, which is a parallelism hazard
because in parallel layout widths are computed before heights. However,
in this particular case we can avoid the parallelism hazard because the
inline direction of a hypothetical box only affects the layout if an
absolutely-positioned element is unconstrained in the inline direction.
Therefore, we can just lay out such absolutely-positioned elements with
a bogus inline position and fix it up once the true inline position of
the hypothetical box is computed. The name for this fix-up process is
"late computation of inline position" (and the corresponding fix-up for
the block position is called "late computation of block position").
This improves the header on /r/rust.
* Enabled acid2 on mac + linux. Updated the reference image. The only difference from the
real acid2 now is the paint order and a 1 pixel horizontal offset on the nose.
* Change line-height to be calculated correctly.
* Apply enclosing element style to text fragments.
Also fixes calculation of background-position percentages:
Rather than multiplying the container size by a percent and aligning the top
left of the image at the resulting width, we also need to subtract a
corresponding percent of the image size, per
http://dev.w3.org/csswg/css2/colors.html#propdef-background-position
"A value pair of '100% 100%' places the lower right corner of the image in the
lower right corner of the padding box. With a value pair of '14% 84%', the
point 14% across and 84% down the image is to be placed at the point 14%
across and 84% down the padding box."
