media
April 10, 2018
هما بلغ تعقيد الفكرة؛ فإنّي أرى أنّ تبسيطها حتمي. الفكرة قبل أن تتحوّل إلى منتج، أو حتّى قبل أن تنفّذ؛ ينبغي أن يحدّد عنصرها أو عَناصرها الأهم.
April 10, 2018
April 14, 2018
لا أخفيك أنّي أحب تصفّح الويب من جهاز الحاسوب؛ لكن هذا لا يجعله مفضّلاً و مقدّمًا دائمًا.
If you want to change the size of a single column, you can use one of the following classes:
is-three-quarters
is-two-thirds
is-half
is-one-third
is-one-quarter
is-full
The other columns will fill up the remaining space automatically.
You can now use the following multiples of 20%
as well:
is-four-fifths
is-three-fifths
is-two-fifths
is-one-fifth
is-full
is-four-fifths
Auto
Auto
is-three-quarters
Auto
Auto
is-two-thirds
Auto
Auto
is-three-fifths
Auto
Auto
is-half
Auto
Auto
is-two-fifths
Auto
Auto
is-one-third
Auto
Auto
is-one-quarter
Auto
Auto
is-one-fifth
Auto
Auto
<div class="columns">
<div class="column is-four-fifths">is-four-fifths</div>
<div class="column">Auto</div>
<div class="column">Auto</div>
</div>
<div class="columns">
<div class="column is-three-quarters">is-three-quarters</div>
<div class="column">Auto</div>
<div class="column">Auto</div>
</div>
<div class="columns">
<div class="column is-two-thirds">is-two-thirds</div>
<div class="column">Auto</div>
<div class="column">Auto</div>
</div>
<div class="columns">
<div class="column is-three-fifths">is-three-fifths</div>
<div class="column">Auto</div>
<div class="column">Auto</div>
</div>
<div class="columns">
<div class="column is-half">is-half</div>
<div class="column">Auto</div>
<div class="column">Auto</div>
</div>
<div class="columns">
<div class="column is-two-fifths">is-two-fifths</div>
<div class="column">Auto</div>
<div class="column">Auto</div>
</div>
<div class="columns">
<div class="column is-one-third">is-one-third</div>
<div class="column">Auto</div>
<div class="column">Auto</div>
</div>
<div class="columns">
<div class="column is-one-quarter">is-one-quarter</div>
<div class="column">Auto</div>
<div class="column">Auto</div>
</div>
<div class="columns">
<div class="column is-one-fifth">is-one-fifth</div>
<div class="column">Auto</div>
<div class="column">Auto</div>
</div>
As the grid can be divided into 12 columns, there are size classes for each division:
is-1
is-2
is-3
is-4
is-5
is-6
is-7
is-8
is-9
is-10
is-11
is-12
Naming convention
Each modifier class is named after
how many columns you want out of 12. So if you want 7 columns out of 12, use is-7
.
is-1
1
1
1
1
1
1
1
1
1
1
1
is-2
1
1
1
1
1
1
1
1
1
1
is-3
1
1
1
1
1
1
1
1
1
is-4
1
1
1
1
1
1
1
1
is-5
1
1
1
1
1
1
1
is-6
1
1
1
1
1
1
is-7
1
1
1
1
1
is-8
1
1
1
1
is-9
1
1
1
is-10
1
1
is-11
1
is-12
القوالب المتاحة