ফ্লোটগুলি ব্যবহার করে কীভাবে কোনও সাইট গ্রিড তৈরি করবেন: প্রবাহের বাইরে পড়ে

ফ্লোটগুলি ব্যবহার করে কীভাবে কোনও সাইট গ্রিড তৈরি করবেন: প্রবাহের বাইরে পড়ে
ফ্লোটগুলি ব্যবহার করে কীভাবে কোনও সাইট গ্রিড তৈরি করবেন: প্রবাহের বাইরে পড়ে

আসুন ভাসার অসুবিধাগুলি মনোযোগ দিন। ব্লক এবং ইনলাইন উপাদানগুলি একে অপরের সাথে কীভাবে আচরণ করে এবং সেগুলি একসাথে ব্যবহার করা যায় কিনা। ক্ষতি কী এবং কীভাবে এটি মোকাবেলা করতে হয় তা বিশ্লেষণ করা যাক Let

ফ্লোটগুলি ব্যবহার করে কীভাবে কোনও সাইট গ্রিড তৈরি করবেন: প্রবাহের বাইরে পড়ে
ফ্লোটগুলি ব্যবহার করে কীভাবে কোনও সাইট গ্রিড তৈরি করবেন: প্রবাহের বাইরে পড়ে

শেষ নিবন্ধে আমরা ভাসমানগুলি ব্যবহার করে সাইটের জন্য একটি সাধারণ গ্রিড তৈরি করেছি তা সত্ত্বেও এগুলি মূলত পাঠ্যের উপাদানগুলির প্রবাহ সামঞ্জস্য করার উদ্দেশ্যে। ফ্লোটের তিনটি অর্থ রয়েছে: বাম - উপাদানগুলি বাম মার্জিনে আটকে থাকে; ডান - উপাদানগুলি ডান প্রান্তে চাপ দেওয়া হয়; কিছুই নয় - মোড়ানো মোড অক্ষম।

একটি ভাসা-মোড়ানো উপাদান আকার এবং প্যাড করা যেতে পারে, তবে উপাদানটি ইনলাইন হলে এটি একটি ব্লক উপাদানটির মতো আচরণ করবে।

। block1 {

ভাসা: বাম;

প্রস্থ: 150px;

}

। block2

ভাসা: ডান;

প্রস্থ: 150px;

}

ভাসমানগুলি ব্যবহার করার সময় আরও একটি সমস্যা রয়েছে যা প্রবাহের বাইরে চলে যাচ্ছে। একের পর এক ব্লকগুলি চলে গেলে এটি উপস্থিত হয়, তবে কেবলমাত্র তার মধ্যে একটিতে ভাসমান সম্পত্তি থাকে, তবে এটি অন্যদের উপরে থাকবে, কারণ এটি অন্যান্য ব্লকগুলি দেখতে পাচ্ছে না। ইনলাইন উপাদানগুলি ভাসমান উপাদানগুলির চারপাশে মোড়ানো করবে তবে এই পাঠ্যটি সহ ব্লকটি ভাসমান উপাদানগুলির মধ্যে থাকবে।

চিত্র
চিত্র

তবে কীভাবে ভাসা ভাসমানের সাথে যোগাযোগ করবে?

তারা পাঠ্যের মতো আচরণ করে: যতক্ষণ ফাঁকা জায়গা থাকে ততক্ষণ তারা একের পর এক দাঁড়ায় এবং তারপরে একটি নতুন লাইনে চলে যায়। সুতরাং, ভাসমানদের সাহায্যে, আমরা গ্রিডগুলি তৈরি করতে শুরু করি। যদি কোনও স্থান বাকী না থাকে, তবে সেগুলি সাইটের প্রস্থের বাইরে চলে গেছে, অর্থাৎ তারা কোথাও যায় না।

যদি ফ্লোটটি সাধারণ ব্লক উপাদানগুলি না দেখায় তবে ব্লক উপাদানগুলি ফ্লোটটি দেখতে শেখানো যেতে পারে। আমরা পরিষ্কার সম্পত্তি ব্যবহার করি, যা সমস্ত পক্ষ থেকে (বা নির্বাচিত থেকে) মোড়ানো অক্ষম করে। যে, পরিষ্কার সঙ্গে একটি উপাদান ভাসা সহ উপাদান অধীনে পড়বে।

প্রস্তাবিত: