Layout

The LIGHTBOX for image galleries.

  1. Add a columns class.
  2. Add 3 or more column class into the columns container.
  3. Then into the last column container nest 2 or more columns containers
  4. For last add 1 column more to that last columns containers and add a figure tag with the class image and a img tag into that figure
  5. Remember to give a size the figure tag.

You can use the classes is-size-6 and so on up to is-size-12 or is-full.

See Codepen

See the Pen Bulma Lightbox by BulmaExpression (@BulmaExpression) on CodePen.


Blog entries with aside menu cards and columns

  1. Add a box container
  2. We make a columns container with the class is-multiline
  3. Then we create 4 column container withing the columns container
  4. Into the first column we add an aside class.
  5. Here we implement an input class.
  6. Here put the botton aligned with theis-grouped class.

You can use the classes is-size-6 has-text-left, has-text-centered, has-text-right and has-text-justified

See Codepen

See the Pen Bulma Blog Entries by BulmaExpression (@BulmaExpression) on CodePen.