<!DOCTYPE html>
<
html
>
<
head
>
<
title
> Bulma Column Sizes </
title
>
</
head
>
<
body
class
=
"has-text-centered"
>
<
h1
class
=
"is-size-2 has-text-success"
>
GeeksforGeeks
</
h1
>
<
b
class
=
"is-size-4"
>
Bulma Column Sizes
</
b
>
<
br
>
<
strong
> Bulma 12 Column System </
strong
>
<
div
class
=
"container"
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-12"
>
<
div
class
=
"notification is-success"
>
is-12
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-11"
>
<
div
class
=
"notification is-success"
>
is-11
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
1
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-10"
>
<
div
class
=
"notification is-success"
>
is-10
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
2
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-9"
>
<
div
class
=
"notification is-success"
>
is-9
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
3
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-8"
>
<
div
class
=
"notification is-success"
>
is-8
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
4
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-7"
>
<
div
class
=
"notification is-success"
>
is-7
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
5
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-6"
>
<
div
class
=
"notification is-success"
>
is-6
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
6
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-5"
>
<
div
class
=
"notification is-success"
>
is-5
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
7
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-4"
>
<
div
class
=
"notification is-success"
>
is-4
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
8
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-3"
>
<
div
class
=
"notification is-success"
>
is-3
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
9
</
div
>
</
div
>
</
div
>
<
div
class
=
"columns"
>
<
div
class
=
"column is-2"
>
<
div
class
=
"notification is-success"
>
is-2
</
div
>
</
div
>
<
div
class
=
"column"
>
<
div
class
=
"notification is-secondary"
>
10
</
div
>
</
div
>
</
div
>
</
div
>
</
body
>
</
html
>