Re: “[css3-page] Overflow-y:-webkit-paged-x behaviour when margins applied."

Bhargavi K <bhargavi.katna@gmail.com> writes:

> Question1
> <html>
> <body style=" margin-top:200px; margin-bottom:200px;
> overflow-y:-webkit-paged-x">
> This is Test behaviour when pagination is applied on page
> </body>
> </html>
> If Body has Overflow-y:-webkit-paged-x and margin-top like above example,
> margin-bottom CSS Properties, Then what should be the expected behaviour??
>
> Attached is the image (overflow-PAGEDX.png) shows with current behaviour.
> This doesnot apply margin across the columns.
> Is this the correct behaviour??
> Should the margin-top and margin-bottom has to be applied to all columns or
> not??

Overflow properties (both those requesting pagination and those for
regular scrolling) on HTML and BODY are propagated to the viewport [1],
while the margin properties still apply to BODY. So, in essence, your TC
is the same as:

<div style="overflow-y:-webkit-paged-x; height:100vh;">
  <div> <!-- HTML -->
    <div style="margin:200px 0;"> <!-- BODY -->
      This is Test behaviour when pagination is applied on page
    </div>
  </div>
</div>

This BODY/HTML-to-viewport propagation magic does not take place for
multicol properties, only for 'overflow'. This explains the difference
between using 'overflow' and e.g. 'column-width' in this case.

To get margins around every page, you could use @page { margin:blah;
}, but WebKit doesn't support that, at least not yet. The paginated
overflow implementation in Opera (Presto) does, though.

[1] http://www.w3.org/TR/CSS2/visufx.html#overflow

-- 
---- Morten Stenshorne, developer, Opera Software ASA ----
---- Office: +47 23692400 ------ Mobile: +47 93440112 ----
------------------ http://www.opera.com/ -----------------

Received on Friday, 3 May 2013 08:39:18 UTC