LayoutCSS Docs Showcase
  • Showcase
  • components

  • Area
  • Box
  • Center
  • Extender
  • Grid
  • Icon
  • Ledge
  • Outsider
  • Rack
  • Sidebar
  • Slider
  • Stack
  • Switcher
  • Utilities

  • align-self
  • bg-img
  • flex
  • font-size
  • h
  • hide
  • line-height
  • p-child
  • p-recursive
  • p
  • ratio
  • relative
  • w
  • z-index
  • Outsider-l

    ...

    The Outsider, is very usefull to build absolute positionning.

    You can give it any position attribute (absolute, fixed, sticky, relative) and then specify its position with top, bottom, left, right.

    • position : the position value of the Outsider, you can use any value allowed in css (absolute, fixed, sticky, relative).
    • top : the top position value.
    • bottom : the bottom position value.
    • left : the left position value.
    • right : the right position value.

    Examples:

    A simple example to show you how to set an element in the right top corner of its parent with the Outsider.

    LayoutCSS

    LayoutCSS

    LayoutCSS

    LayoutCSS

    LayoutCSS

    LayoutCSS

    Here, the Outsider is sticky, so if you scroll you will see the Outsider sticked to the top of its parent.