Scrimba - Bulma how to build a blog solution

This is a solution to the Bulma how to build a blog project on Scrimba. Scrimba helps you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Useful resources
• Author
• Acknowledgments

Overview

The challenge

Users should be able to:

• See a beautiful responsive blog layout

Screenshot

Links

• Solution URL: @GitHub

My process

Built with

• Semantic HTML5 markup
• CSS framework Bulma
• CSS custom properties
• Flexbox
• Mobile-first workflow

What I learned

The newest thing I learnt is:

• How to divide page into columns with CSS Grid and create identifiers to use them into other classes

.grid {
  display: grid;
  grid-template-columns: [xl-start] 1fr 1.5rem [md-start] minmax(
      0,
      624px
    ) [md-end] 1.5rem 1fr [xl-end];
}

.grid * {
  grid-column: md;
}

.grid-xl {
  grid-column: xl;
}

Useful resources

• Bulma - Open source CSS framework that provides ready-to-use frontend components

Author

• Website - Emanuele Del Monte

Acknowledgments

A big thank you to Zaydek Gualtieri