پشتیبانی مرورگر از Flexbox

در وب اکسپلورر 9، 8 و زیر‌خیس طراحی اپلیکیشن هیچ رایا پارس تامین برای Flexbox نیست.

جز این گزینه تک تک مرورگرهای دیگر از Flexbox امان می‌نمایند (و نسبتاً آحاد مرورگرهای گوشی).

درحال حاضر اذن دهید به یکی‌از کاربردهای آن نگاهی بیندازیم.

تغییر و تحول ترتیب ارکان

از فرصت ظهور CSS، تنها یک راه و روش برای ردوبدل ترتیب موادسازنده HTML در کاغذ اینترنت وجود داشت که بوسیله display برای موادسازنده مو جود در دسته‌ ایفا می شد، از جمله گذاشتن table و آن‌گاه تغییر و تحول خصوصیت display بر روی مورد‌های داخلی آن؛ display: table-caption (آن را در بخش بالا قرار می دهد)، display: table-footer-group (آن را به بخش ذیل می‌فرستد) و display: table-header-group (آن را صرفا پایین تیم مورد های display: table-caption می برد).

با این اکنون، Flexbox تغییر‌و تحول ترتیب عنصرها را به طور درونی دارااست. بیایید نگاهی به روش فعالیت آن بیندازیم.

این markup را در لحاظ بگیرید:

I am content in the Header.

I am content in the SideOne.

I am content in the Content.

I am content in the SideTwo.

I am content in the Footer.

می توانید در اینجا ملاحظه کنید که گزینه سوم دارنده یک کلاس HTML از FlexContent میباشد. فکر کنید این div قصد داراست محتوای اساسی را برای شیت نگه داراست.

بسیار بهتر، بیایید تمامی چیز را معمولی نگه داریم. ما بعضی رنگ‌های بی آلایش را اضافه می کنیم تا تفکیک قسمت‌ها معمولی‌خیس گردد و این مورد‌ها را یکی‌از تحت دیگری به ترتیبی که در markup علامت داده شد‌ه‌است تولید می کنیم.