هما بلغ تعقيد الفكرة؛ فإنّي أرى أنّ تبسيطها حتمي. الفكرة قبل أن تتحوّل إلى منتج، أو حتّى قبل أن تنفّذ؛ ينبغي أن يحدّد عنصرها أو عَناصرها الأهم.

لا أخفيك أنّي أحب تصفّح الويب من جهاز الحاسوب؛ لكن هذا لا يجعله مفضّلاً و مقدّمًا دائمًا.

nesting

You can nest columns to have more flexibility in your design. You only need to follow this structure:

columns: top-level columns container
- column
  - columns: nested columns
    - column and so on…

The difference with multiline columns is the order in the HTML code: all the blue columns appear before the red ones. Resize to a narrower viewport to see the result.

First column

First nested column

Second nested column

Second column

50%

Auto

Multiline columns will also have a gap between each line.

                    

                        
                        <div class="columns">
                          <div class="column">
                            <p class="bd-notification is-info">First column</p>
                            <div class="columns is-mobile">
                              <div class="column">
                                <p class="bd-notification is-info">First nested column</p>
                              </div>
                              <div class="column">
                                <p class="bd-notification is-info">Second nested column</p>
                              </div>
                            </div>
                          </div>
                          <div class="column">
                            <p class="bd-notification is-danger">Second column</p>
                            <div class="columns is-mobile">
                              <div class="column is-half">
                                <p class="bd-notification is-danger">50%</p>
                              </div>
                              <div class="column">
                                <p class="bd-notification is-danger">Auto</p>
                              </div>
                              <div class="column">
                                <p class="bd-notification is-danger">Auto</p>
                              </div>
                            </div>
                          </div>
                        </div>

إبداعى 01

شركات 01

مطعم برجر

حفل زفاف

شركات 02

صالون حلاقة

شركة شحن

مطعم 01

منظم حفلات

شركة شحن 02

إبداعى 02

فساتين الزفاف

إبداعى 03

تحت الإنشاء

أخر الاخبار

media