monks/position_try_fallbacks

The position-try-fallbacks CSS property enables you to specify a list of one or more alternative position try fallback options for anchor-positioned elements to be placed relative to their associated anchor elements. When the element would otherwise overflow its inset-modified containing block, the browser will try placing the positioned element in these different fallback positions, in the order provided, until it finds a value that stops it from overflowing its container or the viewport.

The {{cssxref(“position-try”)}} shorthand property can be used to specify {{cssxref(“position-try-order”)}} and position-try-fallbacks values in a single declaration.

This property was originally named and supported in Chromium browsers as position-try-options, with the same property values. Until position-try-fallbacks is supported, use the {{cssxref(“position-try”)}} shorthand instead.

Values

block_end

</>

pub const block_end: #(String, String)

block-end value of position-try-fallbacks

block_start

</>

pub const block_start: #(String, String)

block-start value of position-try-fallbacks

bottom

</>

pub const bottom: #(String, String)

bottom value of position-try-fallbacks

center

</>

pub const center: #(String, String)

center value of position-try-fallbacks

end

</>

pub const end: #(String, String)

end value of position-try-fallbacks

flip_block

</>

pub const flip_block: #(String, String)

  - : Flips the element's position along the block axis.

flip_inline

</>

pub const flip_inline: #(String, String)

  - : Flips the element's position along the inline axis.

flip_start

</>

pub const flip_start: #(String, String)

  - : Flips both the inline and block axis values, swapping the `start` properties with each other, and the `end` properties with each other.- [`position-area`](/en-US/docs/Web/CSS/Reference/Properties/position-area) value  - : Positions the element relative to the edges of its associated anchor element by placing the positioned element on one or more tiles of an implicit 3x3 [position area grid](/en-US/docs/Web/CSS/Reference/Properties/position-area#description) based on the specified {{cssxref("position-area_value","&lt;position-area>")}} value; the effect is the same as a custom {{cssxref("@position-try")}} fallback option containing only a {{cssxref("position-area")}} descriptor.

inherit

</>

pub const inherit: #(String, String)

initial

</>

pub const initial: #(String, String)

inline_end

</>

pub const inline_end: #(String, String)

inline-end value of position-try-fallbacks

inline_start

</>

pub const inline_start: #(String, String)

inline-start value of position-try-fallbacks

left

</>

pub const left: #(String, String)

left value of position-try-fallbacks

none

</>

pub const none: #(String, String)

: The default value. There are no position try fallback options set.

raw

</>

pub fn raw(value: String) -> #(String, String)

Enter a raw string value for position-try-fallbacks

revert

</>

pub const revert: #(String, String)

revert_layer

</>

pub const revert_layer: #(String, String)

right

</>

pub const right: #(String, String)

right value of position-try-fallbacks

self_block_end

</>

pub const self_block_end: #(String, String)

self-block-end value of position-try-fallbacks

self_block_start

</>

pub const self_block_start: #(String, String)

self-block-start value of position-try-fallbacks

self_end

</>

pub const self_end: #(String, String)

self-end value of position-try-fallbacks

self_inline_end

</>

pub const self_inline_end: #(String, String)

self-inline-end value of position-try-fallbacks

self_inline_start

</>

pub const self_inline_start: #(String, String)

self-inline-start value of position-try-fallbacks

self_start

</>

pub const self_start: #(String, String)

self-start value of position-try-fallbacks

span_all

</>

pub const span_all: #(String, String)

span-all value of position-try-fallbacks

span_block_end

</>

pub const span_block_end: #(String, String)

span-block-end value of position-try-fallbacks

span_block_start

</>

pub const span_block_start: #(String, String)

span-block-start value of position-try-fallbacks

span_bottom

</>

pub const span_bottom: #(String, String)

span-bottom value of position-try-fallbacks

span_end

</>

pub const span_end: #(String, String)

span-end value of position-try-fallbacks

span_inline_end

</>

pub const span_inline_end: #(String, String)

span-inline-end value of position-try-fallbacks

span_inline_start

</>

pub const span_inline_start: #(String, String)

span-inline-start value of position-try-fallbacks

span_left

</>

pub const span_left: #(String, String)

span-left value of position-try-fallbacks

span_right

</>

pub const span_right: #(String, String)

span-right value of position-try-fallbacks

span_self_block_end

</>

pub const span_self_block_end: #(String, String)

span-self-block-end value of position-try-fallbacks

span_self_block_start

</>

pub const span_self_block_start: #(String, String)

span-self-block-start value of position-try-fallbacks

span_self_end

</>

pub const span_self_end: #(String, String)

span-self-end value of position-try-fallbacks

span_self_inline_end

</>

pub const span_self_inline_end: #(String, String)

span-self-inline-end value of position-try-fallbacks

span_self_inline_start

</>

pub const span_self_inline_start: #(String, String)

span-self-inline-start value of position-try-fallbacks

span_self_start

</>

pub const span_self_start: #(String, String)

span-self-start value of position-try-fallbacks

span_start

</>

pub const span_start: #(String, String)

span-start value of position-try-fallbacks

span_top

</>

pub const span_top: #(String, String)

span-top value of position-try-fallbacks

span_x_end

</>

pub const span_x_end: #(String, String)

span-x-end value of position-try-fallbacks

span_x_self_end

</>

pub const span_x_self_end: #(String, String)

span-x-self-end value of position-try-fallbacks

span_x_self_start

</>

pub const span_x_self_start: #(String, String)

span-x-self-start value of position-try-fallbacks

span_x_start

</>

pub const span_x_start: #(String, String)

span-x-start value of position-try-fallbacks

span_y_end

</>

pub const span_y_end: #(String, String)

span-y-end value of position-try-fallbacks

span_y_self_end

</>

pub const span_y_self_end: #(String, String)

span-y-self-end value of position-try-fallbacks

span_y_self_start

</>

pub const span_y_self_start: #(String, String)

span-y-self-start value of position-try-fallbacks

span_y_start

</>

pub const span_y_start: #(String, String)

span-y-start value of position-try-fallbacks

start

</>

pub const start: #(String, String)

start value of position-try-fallbacks

top

</>

pub const top: #(String, String)

top value of position-try-fallbacks

unset

</>

pub const unset: #(String, String)

var

</>

pub fn var(variable: String) -> #(String, String)

Enter a variable name to be used for position-try-fallbacks. It will be wrapped in var() and have -- prepended.

x_end

</>

pub const x_end: #(String, String)

x-end value of position-try-fallbacks

x_self_end

</>

pub const x_self_end: #(String, String)

x-self-end value of position-try-fallbacks

x_self_start

</>

pub const x_self_start: #(String, String)

x-self-start value of position-try-fallbacks

x_start

</>

pub const x_start: #(String, String)

x-start value of position-try-fallbacks

y_end

</>

pub const y_end: #(String, String)

y-end value of position-try-fallbacks

y_self_end

</>

pub const y_self_end: #(String, String)

y-self-end value of position-try-fallbacks

y_self_start

</>

pub const y_self_start: #(String, String)

y-self-start value of position-try-fallbacks

y_start

</>

pub const y_start: #(String, String)

y-start value of position-try-fallbacks