Fixed

What’s this?

You can absolutely position shortcodes or content using the Fixed Shortcode. It can be used with in the Block, Box or Columns shortcode. Check out these Box examples below.
I am aligned Top Left
I am aligned Top Right
I am aligned Bottom Left
I am aligned Bottom Right
I am aligned Center Left
I am aligned Center Right
I am aligned Center Center
I am aligned Top Center
I am aligned Bottom Center

Top Left

[fixed top="0px" right="auto" bottom="auto" left="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Top Left[/box]
[/fixed]

Top Right

[fixed top="0px" left="auto" bottom="auto" right="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Top Right[/box]
[/fixed]

Bottom Left

[fixed bottom="0px" right="auto" top="auto" left="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Bottom Left[/box]
[/fixed]

Bottom Left

[fixed bottom="0px" left="auto" top="auto" right="0px" margin_top="10px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Bottom Left[/box]
[/fixed]

Center Left

[fixed top="50%" right="auto" bottom="auto" left="0px" margin_top="0px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Center Left[/box]
[/fixed]

Center Right

[fixed top="50%" left="auto" bottom="auto" right="0px" margin_top="0px" margin_right="10px" margin_bottom="10px" margin_left="10px"]
[box type="basic-light"]I am aligned Center Right[/box]
[/fixed]

Center Center

[fixed top="50%" right="auto" bottom="auto" left="50%" margin_top="-25px" margin_right="10px" margin_bottom="0px" margin_left="-125px" width="250"]
[box type="basic-light" text_align="textcenter"]I am aligned Center Center[/box]
[/fixed]

Top Center

[fixed top="0px" right="auto" bottom="auto" left="50%" margin_top="10px" margin_right="10px" margin_bottom="0px" margin_left="-125px" width="250"]
[box type="basic-light" text_align="textcenter"]I am aligned Top Center[/box]
[/fixed]

Bottom Center

[fixed top="auto" right="auto" bottom="0px" left="50%" margin_top="10px" margin_right="10px" margin_bottom="0px" margin_left="-125px" width="250"]
[box type="basic-light" text_align="textcenter"]I am aligned Bottom Center[/box]
[/fixed]
X

Variations

Change the Skin for this Case Study

Case Studies

Design demos for React