Menu
  1. Home 1
  2. Home 2
  3. Home 3
  4. Home 4
  5. Home 5
  6. Home 6
  7. World

    World news

    • All
    • Health
    • Tech
    • Travel
    • World
    More
      Previous Next

      No content

      A problem occurred while loading content.

    1. Life Style

      Life Style

      • All
      • Arts
      • Health
      • Music
      • Travel
      More
        Previous Next

        No content

        A problem occurred while loading content.

      1. Fashion

        Fashion

        • All
        • Fashion
        More
          Previous Next

          No content

          A problem occurred while loading content.

        1. Sport
          Previous Next

          No content

          A problem occurred while loading content.

        2. Events/Calendar
        3. Features
        Social Links Search User Login Menu
        Tools
        Close
        Close

        Position

        Use these shorthand utilities for quickly configuring the position of an element.

        Common values

        Quick positioning classes are available, though they are not responsive.

        <div class="position-static">...</div>
        <div class="position-relative">...</div>
        <div class="position-absolute">...</div>
        <div class="position-fixed">...</div>
        <div class="position-sticky">...</div>

        Fixed top

        Position an element at the top of the viewport, from edge to edge. Be sure you understand the ramifications of fixed position in your project; you may need to add aditional CSS.

        <div class="fixed-top">...</div>

        Fixed bottom

        Position an element at the bottom of the viewport, from edge to edge. Be sure you understand the ramifications of fixed position in your project; you may need to add aditional CSS.

        <div class="fixed-bottom">...</div>

        Sticky top

        Position an element at the top of the viewport, from edge to edge, but only after you scroll past it. The .sticky-top utility uses CSS’s position: sticky, which isn’t fully supported in all browsers.

        Microsoft Edge and IE11 will render position: sticky as position: relative. As such, we wrap the styles in a @supports query, limiting the stickiness to only browsers that properly can render it.

        <div class="sticky-top">...</div>
        Back To Top