خصوصیت box-align

مثال

این مثال عنصر فرزند div را با استفاده از دو خاصیت box-align و box-pack در وسط قرار می دهد:

		div

		{

		width:350px;

		height:100px;

		border:1px solid black;

		/* Internet Explorer 10 */

		display:-ms-flexbox;

		-ms-flex-pack:center;

		-ms-flex-align:center;

		/* Firefox */

		display:-moz-box;

		-moz-box-pack:center;

		-moz-box-align:center;

		/* Safari, Opera, and Chrome */

		display:-webkit-box;

		-webkit-box-pack:center;

		-webkit-box-align:center;

		/* W3C */

		display:box;

		box-pack:center;

		box-align:center;

		}

خودتان امتحان کنید »

در انتهای این بیاموز، مثال های بیشتری را خواهید دید.

پشتیبانی مرورگرها

هیچ کدام از مرورگرهای اصلی، خصوصیت box-align را پشتیبانی نمی کنند.

مرورگر Internet Explorer 10 به پیشوند -ms- نیاز دارد.

مرورگر Firefox به پیشوند -moz- نیاز دارند.

مرورگرهای Chrome و Safari به پیشوند -webkit- نیاز دارند.

توجه: مرورگر Internet Explorer 9 و نسخه های قبلی آن، این امکان را پشتیبانی نمی کند.

تعریف و کاربرد

با استفاده از خصوصیت box-align می توان نحوه ترازبندی عناصر داخل یک box را مشخص کرد.

مقدار پیشفرض	stretch
ارث بری	خیر
نسخه	CSS3
JavaScript ساختار	object.style.boxAlign="center"

نحوه استفاده

		box-align: start|end|center|baseline|stretch;

مقدار	توضیحات	نمایش دادن
start	برای box هایی که در جهت نرمال هستند، لبه بالایی هر فرزند هم راستای لبه بالایی box قرار می گیرد. برای box هایی که در جهت عکس قرار دارند، لبه پایینی هر فرزند، هم راستا با لبه پایینی box قرار می گیرد.	نمایش دادن »
end	برای box هایی که در جهت نرمال هستند، لبه بالایی هر فرزند هم راستای لبه پایینی box قرار می گیرد. برای box هایی که در جهت عکس قرار دارند، لبه پایینی هر فرزند، هم راستا با لبه بالایی box قرار می گیرد.	نمایش دادن »
center	فضای اضافی به طور مساوی تقسیم می شود، نیمی از از فضا بالای فرزند و نیم دیگر در پایین فرزند قرار می گیرد. به عبارتی فرزند در وسط قرار می گیرد.	نمایش دادن »
baseline	اگر خاصیت box-orient دارای مقادیر inline-axis یا horizontal باشد، تمام فرزندان هم تراز با baseline خود قرار می گیرند.	نمایش دادن »
stretch	عنصر فرزند کشیده می شود تا تما فضا را به خود اختصاص دهد.

لینک های اصلی

مرجع CSS

خصوصیت box-align

مثال

پشتیبانی مرورگرها

تعریف و کاربرد

نحوه استفاده

لِکُلِّ شَیْ‏ءٍ زَکَاةٌ وَ زَکَاةُ الْعَقْلِ احْتِمَالُ الْجُهَّال‏

برای هر چیزی زکاتیست و زکات عقل تحمّل نادانان است.