[csswg-drafts] [css-page][css-break] Bleed to page/fragmentainer margin bounds (#5145)

stantonma has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-page][css-break] Bleed to page/fragmentainer margin bounds ==
In print and paginated media, the page (or fragmentainer) containing the content usually has a margin. In most ePub implementations, the margin is user configurable, so cannot be known to author at content creation time.

In print, there's two common patterns where the page margins should be ignored:

**1. Hero Images**
Where an image at the top of the pages bleed top, left, and right to form a header.

**2. Full Bleed Images**
Where an image takes up the full screen and bleeds margins in all directions. The image aspect ratio can be preserved if desired by either letterboxing or clipping the image to match the screen size.

Today in CSS there's no good way to achieve either of the above scenarios. If the author knew the margin size at time of content creation maybe something like below could work:

```
.fullbleed
{
  width: 100vw;
  height: 100vh;
  margin-top: -50px;
  margin-left: -50px;
}
```

Still though, it leaves a bit to be desired since there's some interaction that needs to be defined with regards to extending past the bottom of the fragmentainer's content area.

I think a more natural way for authors would be to specify some property on a container that allows it to perform the bleed calculation automatically. Possibly by increasing the available remaining size of the fragmentainer.

Another option would be to implement page templates, and set margins on a specific page to zero - but this a) doesn't work for hero images above and b) raises issues about resolving conflicts with the user margins set by the UA.

Looking for feedback on how we can enable this use case, since it seems to be a very desirable feature in the ePub world.


Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/5145 using your GitHub account

Received on Monday, 1 June 2020 22:50:08 UTC