move-to property CSS Reference

Definition and Usage

The 'move-to' property causes the element or pseudo-element to be removed from the flow and reinserted at a later point in the document. The content is reinserted using the 'pending()' value of the 'content' property. This property applies to all elements as well as the '::before', '::after', and '::alternate' pseudo-elements. The '::alternate' pseudo-element in fact exists exclusively for the purpose of being moved by this property, e.g. in the creation of footnotes.

Syntax

move-to: normal | here | <identifier> ;

Values

normal

For '::alternate' pseudo-elements, if the superior parent uses the 'footnote' counter in its 'content' property then the computed value of 'move-to' is 'footnotes'.

For '::alternate' pseudo-elements, if the superior parent uses the 'endnote' counter in its 'content' property then the computed value of 'move-to' is 'endnotes'.

For '::alternate' pseudo-elements, if the superior parent uses the 'section-note' counter in its 'content' property then the computed value of 'move-to' is 'section-notes'.

Otherwise the computed value of the move-to property is 'here'.

here

The element or pseudo-element is not moved. This value inhibits the creation of '::alternate' pseudo-elements and any pseudo-elements that have such a pseudo-element as a superior.

<identifier>

The element is not displayed at the current location, but at the next occurrence of 'pending(<identifier>)' (where the identifiers match), with all other elements moved to that point, in document order. If at the end af the document (after the '::after' pseudo-elements of the root element) there are outstanding elements, then they are all inserted in document order at that point.

Examples

.class {
    move-to: normal;
}