Source

கிளியர்ஃபிக்ஸ்

க்ளியர்ஃபிக்ஸ் பயன்பாட்டைச் சேர்ப்பதன் மூலம் ஒரு கொள்கலனில் மிதக்கும் உள்ளடக்கத்தை விரைவாகவும் எளிதாகவும் அழிக்கவும்.

மூல உறுப்பில்float சேர்ப்பதன் மூலம் களை எளிதாக அழிக்கவும் . மிக்ஸினாகவும் பயன்படுத்தலாம்..clearfix

<div class="clearfix">...</div>
// Mixin itself
@mixin clearfix() {
  &::after {
    display: block;
    content: "";
    clear: both;
  }
}

// Usage as a mixin
.element {
  @include clearfix;
}

பின்வரும் உதாரணம் clearfix ஐ எவ்வாறு பயன்படுத்தலாம் என்பதைக் காட்டுகிறது. கிளியர்ஃபிக்ஸ் இல்லாமல், பொத்தான்களைச் சுற்றி ரேப்பிங் டிவ் பரவாது, இது உடைந்த அமைப்பை ஏற்படுத்தும்.

<div class="bg-info clearfix">
  <button type="button" class="btn btn-secondary float-left">Example Button floated left</button>
  <button type="button" class="btn btn-secondary float-right">Example Button floated right</button>
</div>