📘
Lab Website Template docs
  • Introduction
    • Overview
    • Is this right for me?
    • Gallery
    • Support
  • Getting Started
    • Set up your site
    • Set up your URL
    • Tidy up your repo
    • Change your site
    • Preview your site
  • Basics
    • Repo structure
    • Configure your site
    • Edit pages
    • Write basic content
    • Use your logo
    • Customize your theme
    • Team members
    • Blog posts
    • Citations
    • Components
      • Section
      • Figure
      • Button
      • Icon
      • Feature
      • List
      • Citation
      • Card
      • Portrait
      • Post Excerpt
      • Alert
      • Tags
      • Float
      • Grid
      • Cols
      • Search
      • Site Search
  • Advanced
    • Update your template
    • Embeds
    • Math, diagrams, videos, etc.
    • Analytics
    • Data and collections
    • Jekyll plugins
    • Custom components
    • Background knowledge
Powered by GitBook
On this page
  1. Basics
  2. Components

Float

A left or right "floated" piece of content

PreviousTagsNextGrid

Last updated 2 years ago

A piece of floating content that the main page content will . Useful for putting a figure to the side in a long page of paragraphs.

{% capture content %}
  {% include figure.html ... %}
{% endcapture %}

{%
  include float.html
  content=content
  flip=true
%}

Several paragraphs of text.

{% include float.html clear=true %}
Parameter
Description
Default

content

to flow around.

flip

Whether to flip side of page content floats to.

false (floats to left)

clear

Set to true to "" the current float, i.e. content after this will no longer flow around the previous float component, and will instead go below it.

In general, you shouldn't need the clear parameter, because you should be using this component when the content flowing around is much taller/longer than the floating content (thus the floating content will never push and interfere with undesired things like headings). If you need two roughly equal height things next to each other, you can use the or even the component instead (as long as you're okay with equal width).

👁️
PREVIEW
flow around
cols
feature
stop
Arbitrary content