نکته مهم

ویژگی box-sizing در CSS

با استفاده از ویژگی box-sizing در CSS میتوان مشخص کرد که آیا اندازه ویژگی های Border و Padding بروی اندازه عرض و ارتفاع یک عنصر تاثیر بگذراند یا خیر.

این رو بدونید که در حالت عادی / پیش فرض اندازه عرض و ارتفاع یک عنصر شامل اندازه Border و Padding می باشد، این یعنی اگه مثلا اندازه باکس ما ۱۰۰ پیکسل بود و از ویژگی Padding استفاده کرده بودیم با مقدار ۱۰ پیکسل ، خب این ۲ تا باهم جمع میشن و اندازه اصلی باکس رو تشکیل میدن.

حال ما با استفاده از ویژگی box-sizing میتونیم مشخص کنیم که آیا اندازه ویژگی های Border و Padding بروی اندازه اصلی عرض و ارتفاع عنصر تاثیر بگذراند یا خیر.

ویژگی هایی که بروی اندازه اصلی یک عنصر تاثیر میزارند :

Padding

Border