বুটস্ট্র্যাপ ড্রপডাউন বুদ্বুদ ডান সারিবদ্ধ (ধাক্কা-ডান নয়)


90

আমার শীর্ষ মেনুতে কার্ট রয়েছে, ব্যবহার করে push-rightএবং আমার সমস্যাটি হ'ল ড্রপডাউন বুদ্বুদ পৃষ্ঠাটির বাইরে চলে যায়। আমি বুদ্বুদ ডানদিকে প্রান্তিককরণের চেষ্টা করছি, যাতে এটি 'ক্লিক' এর সাথে ডান-প্রান্তিক হয়

এটার মত

এখানে চিত্র বর্ণনা লিখুন

এইচটিএমএল:

<div class="cart pull-right">
  <ul class="nav">
    <li class="dropdown">
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">CLICK</a>
       <div class="dropdown-menu">
       STUFF
       </div>
    </li>
  </ul>
</div>

4
আপনার কাছে যা আছে তা অন্যকে দেখানোর জন্য jsfiddle.net এ রাখা ভাল ।
JofryHS

আপনি right:0;ড্রপডাউন চেষ্টা করেছেন?
রাহুল

উত্তর:


191

বুটস্ট্র্যাপ 3.1+

ক্লাস যুক্ত করা হচ্ছে .ড্রপডাউন-মেনু-ডানদিকে একই ডিভের ক্লাস ড্রপডাউন-মেনু রয়েছে:

<div class="dropdown-menu dropdown-menu-right">
    STUFF
</div>

http://getbootstrap.com/compferences/#DPdowns-alignment

বুটস্ট্র্যাপ 2.3 এবং 3.0

ক্লাসটি যোগ করুন। ক্লাস ড্রপডাউন-মেনু সহ একই ডিভের ডানদিকে টানুন

<div class="dropdown-menu pull-right">
    STUFF
</div>

বুটস্ট্র্যাপ 3.0 ব্যবহার করে এটি আমার পক্ষে কাজ করে বলে মনে হচ্ছে


20
V3.1.0 থেকে আপনি ড্রপডাউন-মেনু-ডান ব্যবহার করতে পারেন । Github.com/twbs/bootstrap/blob/v3.1.0/less/DPdowns.less#L135
লরেন্ট

19

এটি সিএসএস বৈশিষ্ট্য ব্যবহার করে এবং ডান সারিবদ্ধ করার জন্য বিশেষত এই সমস্যার জন্য এটি বুটস্ট্র্যাপ শ্রেণীর dropdown-menu-right সাথে সমাধান করা যেতে পারে ।dropdown-menuright: 0;left: auto;

এই সমাধানটি আমার পক্ষে কাজ করছে।

উত্স - http://getbootstrap.com/compferences/#btn-roddowns-DPup (এর জন্য বিকাশকারী সরঞ্জামগুলিতে যান)


4
হ্যাঁ, এটি সঠিক সমাধান (বুটস্ট্র্যাপ 3.3.7)। মেনু অপশনগুলি (বোতামে নয়) রয়েছে এমন ক্লাসটি dropdown-menu-rightআপনি ক্লাসে যুক্ত করেছেন তা নিশ্চিত করুনul
মিগুয়েল



2

ঠিক আছে বুঝেছি!

position:relative;left:0 চালু <ul class="dropdown-menu">

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.