<%= pb_rails("title", props: {size: 4, text: "Row"}) %>
<%= pb_rails("flex", props: {horizontal: "left"}) do %> <%= pb_rails("flex/flex_item") do %>1<% end %> <%= pb_rails("flex/flex_item") do %>2<% end %> <%= pb_rails("flex/flex_item") do %>3<% end %> <%= pb_rails("flex/flex_item") do %>4<% end %> <% end %>

<%= pb_rails("flex", props: {horizontal: "center"}) do %> <%= pb_rails("flex/flex_item") do %>1<% end %> <%= pb_rails("flex/flex_item") do %>2<% end %> <%= pb_rails("flex/flex_item") do %>3<% end %> <%= pb_rails("flex/flex_item") do %>4<% end %> <% end %>

<%= pb_rails("flex", props: {horizontal: "right"}) do %> <%= pb_rails("flex/flex_item") do %>1<% end %> <%= pb_rails("flex/flex_item") do %>2<% end %> <%= pb_rails("flex/flex_item") do %>3<% end %> <%= pb_rails("flex/flex_item") do %>4<% end %> <% end %>

<%= pb_rails("title", props: {size: 4, text: "Column"}) %>
<%= pb_rails("flex", props: {orientation: "column", horizontal: "left"}) do %> <%= pb_rails("flex/flex_item") do %>1<% end %> <%= pb_rails("flex/flex_item") do %>2<% end %> <%= pb_rails("flex/flex_item") do %>3<% end %> <%= pb_rails("flex/flex_item") do %>4<% end %> <% end %>

<%= pb_rails("flex", props: {orientation: "column", horizontal: "center"}) do %> <%= pb_rails("flex/flex_item") do %>1<% end %> <%= pb_rails("flex/flex_item") do %>2<% end %> <%= pb_rails("flex/flex_item") do %>3<% end %> <%= pb_rails("flex/flex_item") do %>4<% end %> <% end %>

<%= pb_rails("flex", props: {orientation: "column", horizontal: "right"}) do %> <%= pb_rails("flex/flex_item") do %>1<% end %> <%= pb_rails("flex/flex_item") do %>2<% end %> <%= pb_rails("flex/flex_item") do %>3<% end %> <%= pb_rails("flex/flex_item") do %>4<% end %> <% end %>

<%= pb_rails("flex", props: {orientation: "column", horizontal: "stretch"}) do %> <%= pb_rails("flex/flex_item") do %>1<% end %> <%= pb_rails("flex/flex_item") do %>2<% end %> <%= pb_rails("flex/flex_item") do %>3<% end %> <%= pb_rails("flex/flex_item") do %>4<% end %> <% end %>