Skip to content

[css-page-floats] HTML errors checked #48

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Sep 8, 2015
Merged

[css-page-floats] HTML errors checked #48

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
89 changes: 13 additions & 76 deletions css-page-floats/Overview.bs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -153,7 +153,7 @@ Floating to the inline-start/inline-end and block-start/block-end</h2>

Maybe something like:

<code><pre>
<pre><code>
&lt;style>
.float {
float-reference: float-container;
Expand All @@ -171,7 +171,7 @@ float-container: true;
&lt;span class="inline-block">[&lt;span class="float">FLOAT&lt;/span>] &lt;/span>
And some more text&lt;/p>
&lt;/div>
</pre></code>
</code></pre>

This should float both floats with reference to the &lt;div id="container">
element, rather than the &lt;P> and inline &lt;SPAN> elements.
Expand Down Expand Up @@ -281,7 +281,7 @@ And some more text&lt;/p>
laying out the document.

<dt><dfn>snap-block</dfn>
<dd>same as <tt>snap-block(2em, near)</tt>
<dd>same as <code>snap-block(2em, near)</code>

<dt><dfn>snap-inline(&lt;length> [, left | right | near ]?)</dfn>
<dd>
Expand All @@ -303,7 +303,7 @@ And some more text&lt;/p>
out the document.

<dt><dfn>snap-inline</dfn>
<dd>same as <tt>snap-inline(2em, near)</tt>
<dd>same as <code>snap-inline(2em, near)</code>

<dt><dfn>none</dfn>
<dd>The box is not floated.
Expand Down Expand Up @@ -511,7 +511,7 @@ The 'clear' property</h2>
&ltdiv class=figure>&lt;/div>
&ltdiv class=figure>&lt;/div>
</pre>
<img src="images/16.png">
<img alt="sample rendering" src="images/16.png">
</div>

<div class="example">
Expand All @@ -524,7 +524,7 @@ The 'clear' property</h2>
&ltdiv class=figure>&lt;/div>
</pre>

<img src="images/17.png">
<img alt="sample rendering" src="images/17.png">
</div>


Expand All @@ -539,7 +539,7 @@ The 'clear' property</h2>
&ltdiv class=figure>&lt;/div>
</pre>

<img src="images/16.png">
<img alt="sample rendering" src="images/16.png">
</div>

<div class="example">
Expand All @@ -553,7 +553,7 @@ The 'clear' property</h2>
&ltdiv class=figure>&lt;/div>
</pre>

<img src="images/17.png">
<img alt="sample rendering" src="images/17.png">
</div>


Expand Down Expand Up @@ -803,7 +803,7 @@ img {
Pull quotes are often centered in a column. In this example, the pull quote is
floated to the right, and then pushed back into the center.

<img src="images/region_pullquote.png">
<img alt="sample rendering" src="images/region_pullquote.png">

<pre>
.pullquote {
Expand Down Expand Up @@ -936,7 +936,7 @@ Differences between inline floats and absolutely positioned elements</h3>
by a display-inline-block element. The element, which has a green border, is
expanded to include the brown float.

<code><pre>
<pre><code>
&lt;style>
.float {
float: left;
Expand Down Expand Up @@ -968,7 +968,7 @@ p {
Second paragraph and some more text.
&lt;/p>
&lt;/div>
</pre></code>
</code></pre>

<img alt="sample rendering" src="images/float_containing_context.png">

Expand All @@ -978,7 +978,7 @@ p {
display-inline-block element. However, the element, marked by a green border,
does not expand to include the brown, absolutely positioned element.

<code><pre>
<pre><code>
&lt;style>
.float {
position: absolute;
Expand Down Expand Up @@ -1010,7 +1010,7 @@ canvas {
Second paragraph and some more text.
&lt;/p>
&lt;/div>
</pre></code>
</code></pre>

<img alt="sample rendering" src="images/positioned_containing_context.png">

Expand Down Expand Up @@ -1104,69 +1104,6 @@ p { float-reference: page; float: top; float-defer: last }
<li>keep the number of pages to a minimum
</ol>

<h2 class="no-num" id="changes">Changes</h2>

Changes from the
<a href="https://hg.csswg.org/drafts/raw-file/108d7e3ff204/css-page-floats/Overview.html">
24 September 2013 CSS Page Floats Editor's Draft
</a>
:

<ol>
<li>
Add term definition for 'not overlapping'.
</li>
<li>
Use term "document order" instead of "order ... appear in the DOM".
</li>
<li>
Make the order of page float placement determined both by DOM and how high
in the DOM the page float reference is.
</li>
<li>
Specify use of padding edges for float references and margin edges for page
floats for placement.
</li>
<li>
Term change: fragmentation flow -> fragmentation context.
</li>
<li>
Don't allow page floats to go beyond the edges of the float reference.
<li>
Added details on placement process of page floats.
</li>
<li>
Use "fragmentation container" term instead of "column/region/page".
</li>
<li>
Added info on variably sized float references and deferring beyond the last
fragmentation container.
<li>
Specified that block-start and block-end floats have an initial inline size
of 100% and are placed at the inline-start.
<li>
Simplified, removed advanced options that weren't defined entirely.
<li>
Switched to bikeshed document type
<li>
Changed editor
<li>
Removed sections on Regions and Exclusions
<li>
Added float-reference
<li>
Added possibility to float into regions
<li>
Removed part about numeric column-span
<li>
Removed possibility to defer for page and column independently for the same
float
<li>
Adjusted clear to work with pages/regions/columns
<li>
Removed part about float inside/outside for pages
</ol>

<h2 class="no-num" id="acks">
Acknowledgments</h2>

Expand Down