Div উল্লম্ব স্ক্রোলবার শো

Question

আমি ভাবছি যে কীভাবে স্থায়ীভাবে আমাদের নিয়মিত বারগুলির মতো ডিভের উল্লম্ব বারটি (কোনও স্ক্রোলিং না থাকলে গ্রেইড আউট) দেখানো সম্ভব show মূলত আমি একটি সম্পূর্ণ ওয়েবসাইটকে একটি ডিভিতে রাখার চেষ্টা করছি (যেমনটি জিমেইল / ফেসবুক), সুতরাং পৃষ্ঠার দীর্ঘ না থাকলে উল্লম্ব স্ক্রোল বারের অভাবে পুরো পৃষ্ঠাটি স্থানান্তরিত হয়।

আমার এই সমস্যার সমাধান দরকার। আমি ওভারফ্লো-ওয়াই: স্ক্রোলটি চেষ্টা করেছি। তবে এটি মোটেও কাজ করে বলে মনে হচ্ছে না।

Answer 1

আপনি কোন ব্রাউজারে পরীক্ষা করছেন?

আপনি কোন ডিওসিটিপ সেট করেছেন?

আপনি ঠিক কীভাবে আপনার সিএসএস ঘোষণা করছেন?

আপনি কি নিশ্চিত যে আপনি এর ;আগে / পরে কোনওটি মিস করেন নি overflow-y: scroll?

আমি কেবলমাত্র আই 7 এবং ফায়ারফক্সে নিম্নলিখিতটি পরীক্ষা করেছি এবং এটি দুর্দান্ত কাজ করে

<!-- Scroll bar present but disabled when less content -->
<div style="width: 200px; height: 100px; overflow-y: scroll;">
  test
</div>

<!-- Scroll bar present and enabled when more contents -->        
<div style="width: 200px; height: 100px; overflow-y: scroll;">
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
</div>

Comments

আই 7 এবং ফায়ারফক্সেও পরীক্ষিত হয়েছে এবং কেবল <ডি স্টাইল = "ওভারফ্লো-ওয়াই: স্ক্রোল"> হ্যালো </ div> কাজ করে।

— স্টায়ালে

এটি আমি স্টাইল শিটটি ব্যবহার করছি: #main_container {প্রস্থ: 100%; পটভূমি-রঙ: ওভারফ্লো-ওয়াই: স্ক্রোল; উচ্চতা: 100%; অবস্থান: পরম; }

— অ্যালেক স্মার্ট

<! ডক্টইপই এইচটিএমএল পাবলিক "- // ডাব্লু 3 সি // ডিটিডি এইচটিএমএল 4.01 ট্রানজিশনাল // এন" " w3.org/TR/html4/loose.dtd ">

— অ্যালেক স্মার্ট

ওহ এখন এটি কাজ করছে ... ধন্যবাদ .. আমি বাইচেন্স একটি স্টাইল ট্যাগ রেখে বললাম ওভারফ্লো: ডিভের মধ্যে স্বয়ং, যা আমার বাহ্যিক সিএসএসকে ওভাররোট করে ...

— অ্যালেক স্মার্ট

Answer 2

আপনি চেষ্টা করেছেন overflow-y:auto? এটি আপনি যা চান ঠিক তা নয়, কারণ স্ক্রোলবারটি কেবল যখন প্রয়োজন হবে তখনই প্রদর্শিত হবে।

Answer 3

সর্বদা: আপনি যদি সর্বদা উল্লম্ব স্ক্রোলবার চান তবে ব্যবহার করুনoverflow-y: scroll;

জেএসফিডাল:

<div style="overflow-y: scroll;">
......
</div>

যখন প্রয়োজন : আপনি যখন প্রয়োজন যখন কেবল উল্লম্ব স্ক্রোলবার চান, ব্যবহার করুন overflow-y: auto;(এই ক্ষেত্রে আপনাকে একটি উচ্চতা নির্দিষ্ট করতে হবে)

জেএসফিডাল:

<div style="overflow-y: auto; height:150px; ">
....
</div>