فلیکس باکس جنریٹر

لچکدار سمت کے ساتھ تجربہ کریں، لپیٹیں، جواز پیش کریں، اور سیدھ کریں۔ آئٹم لے آؤٹ کو لائیو اپ ڈیٹ دیکھیں، پھر کنٹینر CSS کاپی کریں۔

Flexbox Generator

Live

flex-directionflex-wrapjustify-contentalign-items

Gap12px

Items5

CSS output

display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
gap: 12px;

Key capabilities

لچکدار سمت کے ساتھ تجربہ کریں، لپیٹیں، جواز پیش کریں اور سیدھ میں لائیں — لے آؤٹ کی تازہ کاری لائیو دیکھیں۔
آپ کے براؤزر میں چلتا ہے۔
استعمال کرنے کے لیے مفت

استعمال کا طریقہ

فلیکس سمت سیٹ کریں اور لپیٹیں۔
جواز پیش کرنے والے مواد کو ایڈجسٹ کریں اور آئٹمز کو سیدھ کریں۔
Flexbox CSS کاپی کریں۔

How this tool works

فلیکس سمت سیٹ کریں اور لپیٹیں۔
جواز پیش کرنے والے مواد کو ایڈجسٹ کریں اور آئٹمز کو سیدھ کریں۔
Flexbox CSS کاپی کریں۔

Recommended settings

پہلے پہلے سے طے شدہ اختیارات استعمال کریں، پھر ضرورت پڑنے پر ایڈجسٹ کریں۔

Supported formats

Text / on-page input

File size and limits

پرانے فونز پر بہت پیچیدہ ملٹی لیئر پیش نظارہ سست محسوس ہو سکتے ہیں۔

Privacy

کلر اور سی ایس ایس جنریٹر مکمل طور پر آپ کے براؤزر میں چلتے ہیں۔ پیش نظارہ اور تبدیلیاں کبھی بھی آپ کی طرزیں اپ لوڈ نہیں کرتی ہیں۔

Common use cases

جب بھی آپ کو ضرورت ہو Flexbox جنریٹر کا استعمال کریں: لچکدار سمت کے ساتھ تجربہ کریں، لپیٹیں، جواز بنائیں اور سیدھ میں لائیں — لے آؤٹس اپ ڈیٹ لائیو دیکھیں۔

Troubleshooting

پیش نظارہ پیسٹ کے بعد مختلف نظر آتا ہے۔

اپنے صفحہ پر مسابقتی سی ایس ایس کی جانچ کریں (ری سیٹ، وراثت میں ملے رنگ)۔ تیار کردہ اصول کو پہلے الگ تھلگ اسٹائل شیٹ میں کاپی کریں۔

اکثر پوچھے گئے سوالات

کیا یہ میرا CSS اپ لوڈ کرتا ہے؟

نہیں، جنریٹر اور کنورٹرز آپ کے براؤزر میں لائیو پیش نظارہ کے ساتھ چلتے ہیں۔

کیا مجھے ایک اکاؤنٹ کی ضرورت ہے؟

نہیں، ٹول کھولیں، کنٹرولز کو بہتر کریں، اور CSS کاپی کریں۔