CSS এর সাথে ডিভের পরে লাইন বিরতি রোধ করার কোনও উপায় আছে কি?
যেমন আমার আছে
<div class="label">My Label:</div>
<div class="text">My text</div>
এবং এটির মতো প্রদর্শন করতে চান:
আমার লেবেল: আমার পাঠ্য
উত্তর:
display:inline;
বা
float:left;
বা
display:inline-block; - সমস্ত ব্রাউজারে কাজ নাও করতে পারে।
divএখানে একটি ব্যবহারের উদ্দেশ্য কী ? আমি একটি প্রস্তাব দেব span, কারণ এটি একটি ইনলাইন-স্তরের উপাদান, অন্যদিকে divএকটি ব্লক-স্তর উপাদান।
মনে রাখবেন যে উপরের প্রতিটি বিকল্প আলাদাভাবে কাজ করবে।
display:inline;divএর সমতুল্যে রূপান্তরিত করবে span। এটা তোলে দ্বারা প্রভাবিত হতে হবে margin-top, margin-bottom, padding-top, padding-bottom, height, ইত্যাদি
float:left;divএকটি ব্লক স্তরের উপাদান হিসাবে রাখে । এটি এখনও অবধি স্থান গ্রহণ করবে যেন এটি একটি ব্লক, তবে প্রস্থটি সামগ্রীতে লাগানো হবে (ধরে নেওয়া width:auto;)। এটি clear:left;নির্দিষ্ট প্রভাবের জন্য প্রয়োজন হতে পারে ।
display:inline-block;"উভয় বিশ্বের সেরা" বিকল্পটি। divএকটি ব্লক উপাদান হিসাবে বিবেচিত হয়। এটা সব সাড়া margin, paddingএবং heightযেমন একটি ব্লক উপাদান জন্য প্রত্যাশিত নিয়ম। তবে এটি অন্যান্য উপাদানগুলির মধ্যে স্থান নির্ধারণের উদ্দেশ্যে একটি ইনলাইন উপাদান হিসাবে বিবেচনা করা হয়।
আরও তথ্যের জন্য এটি পড়ুন ।
.label, .text {display: inline}
আপনি যদি এটি ব্যবহার করেন তবে আপনি সম্ভবত ডিভগুলি স্প্যানের মধ্যে পরিবর্তন করতে পারেন।
divউপাদান ব্লক উপাদান, তাই ডিফল্ট ভাবে তারা পূর্ণ প্রাপ্তিসাধ্য প্রস্থ ইউপিপি নিতে।
একটি উপায় হ'ল এগুলি ইনলাইন উপাদানগুলিতে পরিণত করা:
.label, .text { display: inline; }
এটি spanউপাদানগুলির পরিবর্তে উপাদান ব্যবহার করার মতো একই প্রভাব ফেলবে div।
আর একটি উপায় হল উপাদানগুলি ভাসা:
.label, .text { float: left; }
এটি উপাদানগুলির প্রস্থ কীভাবে সিদ্ধান্ত নেওয়া হবে তা পরিবর্তন করবে, যাতে ত্রিশটি কেবল তাদের সামগ্রীর মতোই প্রশস্ত হবে। এটি একে অপরের পাশে উপাদানগুলিও ভাসিয়ে তুলবে, চিত্রগুলি একে অপরের পাশে প্রবাহিত হওয়ার অনুরূপ।
আপনি উপাদানগুলি পরিবর্তন করতেও বিবেচনা করতে পারেন। divউপাদান ডকুমেন্ট বিভাগের জন্য দেয়ার উদ্দেশ্যে করা, আমি সাধারণত একটি ব্যবহার labelএবং spanভালো একটি কনস্ট্রাক্ট জন্য উপাদান:
<label>My Label:</label>
<span>My text</span>
ডিভাইসগুলি কোনও ওয়েবসাইটকে কাঠামো দেওয়ার জন্য বা প্রচুর পাঠ্য বা উপাদানগুলি ধারণ করতে ব্যবহৃত হয়, তবে আপনি এগুলি লেবেল হিসাবে ব্যবহার করেন বলে মনে হচ্ছে আপনার স্প্যান ব্যবহার করা উচিত, এটি উভয় পাঠ্য স্বয়ংক্রিয়ভাবে প্রতিটিের পাশে রেখে দেবে এবং আপনাকে দু: খিত হওয়া প্রয়োজন হবে না এটির জন্য সিএসএস কোড।
এমনকি অন্য ব্যক্তিরা আপনাকে উপাদানগুলি ভাসিয়ে দিতে বললেও আপনি কেবল ট্যাগগুলি পরিবর্তন করেন best
আমি মনে করি না আমি এই সংস্করণটি দেখেছি:
<div class="label">My Label:<span class="text">My text</span></div>
clear:noneলেবেলে CSS বৈশিষ্ট্য প্রয়োগ করার চেষ্টা করুন applying
.label {
clear:none;
}
divএখনও ডিফল্ট রয়েছে width:autoযা এটি সমস্ত উপলব্ধ প্রস্থ গ্রহণ করে।
আমি বহুবার সাফল্য পেয়েছি তার পরে লাইন ব্রেক ছাড়াই ডিভ এর পেতে, ভাসমান CSS বৈশিষ্ট্য এবং প্রস্থ সিএসএস অ্যাট্রিবিউটের সাথে চারপাশে খেলে।
অবশ্যই সমাধানটি কাজ করার পরে আপনাকে এটি সমস্ত ব্রাউজারে পরীক্ষা করতে হবে এবং প্রতিটি ব্রাউজারে আপনাকে উইন্ডোজগুলির পুনরায় আকার দিতে হবে তা নিশ্চিত করতে যে এটি সমস্ত পরিস্থিতিতে কাজ করে।