ମୁଖ୍ୟ ବିଷୟବସ୍ତୁକୁ ଯାଆନ୍ତୁ | ଡକସ୍ ନେଭିଗେସନ୍ କୁ ଯାଆନ୍ତୁ |
Check
in English

ଭାସମାନ |

ଆମର ପ୍ରତିକ୍ରିୟାଶୀଳ ଫ୍ଲୋଟ୍ ଉପଯୋଗିତାକୁ ବ୍ୟବହାର କରି ଯେକ any ଣସି ଉପାଦାନ ଉପରେ, ଯେକ any ଣସି ବ୍ରେକପଏଣ୍ଟରେ ଟୋଗଲ୍ ଭାସମାନ |

ଏହି ପୃଷ୍ଠାରେ |

ସମୀକ୍ଷା

ଏହି ୟୁଟିଲିଟି ଶ୍ରେଣୀଗୁଡ଼ିକ CSS floatପ୍ରପର୍ଟି ବ୍ୟବହାର କରି ସାମ୍ପ୍ରତିକ ଭ୍ୟୁପୋର୍ଟ୍ ସାଇଜ୍ ଉପରେ ଆଧାର କରି ବାମ କିମ୍ବା ଡାହାଣକୁ ଏକ ଉପାଦାନ ଭାସମାନ କରେ, କିମ୍ବା ଫ୍ଲୋଟିଂକୁ ଅକ୍ଷମ କରେ | !importantନିର୍ଦ୍ଦିଷ୍ଟତା ସମସ୍ୟାକୁ ଏଡାଇବା ପାଇଁ ଅନ୍ତର୍ଭୂକ୍ତ କରାଯାଇଛି | ଏମାନେ ଆମର ଗ୍ରୀଡ୍ ସିଷ୍ଟମ୍ ସହିତ ସମାନ ଭ୍ୟୁପୋର୍ଟ ବ୍ରେକପଏଣ୍ଟ ବ୍ୟବହାର କରନ୍ତି | ଦୟାକରି ସଚେତନ ରୁହନ୍ତୁ ଫ୍ଲୋଟ୍ ଉପଯୋଗିତା ଫ୍ଲେକ୍ସ ଆଇଟମ୍ ଉପରେ କ effect ଣସି ପ୍ରଭାବ ପକାଇବ ନାହିଁ |

ସମସ୍ତ ଭ୍ୟୁପୋର୍ଟ ଆକାରରେ ଫ୍ଲୋଟ୍ ଆରମ୍ଭ |

ସମସ୍ତ ଭ୍ୟୁପୋର୍ଟ ଆକାରରେ ଫ୍ଲୋଟ୍ ଶେଷ |

ସମସ୍ତ ଭ୍ୟୁପୋର୍ଟ ଆକାରରେ ଭାସନ୍ତୁ ନାହିଁ |
html
<div class="float-start">Float start on all viewport sizes</div><br>
<div class="float-end">Float end on all viewport sizes</div><br>
<div class="float-none">Don't float on all viewport sizes</div>

ପ୍ରତିକ୍ରିୟାଶୀଳ |

ପ୍ରତ୍ୟେକ floatମୂଲ୍ୟ ପାଇଁ ପ୍ରତିକ୍ରିୟାଶୀଳ ପରିବର୍ତ୍ତନ ମଧ୍ୟ ବିଦ୍ୟମାନ |

ଦୃଶ୍ୟମାନ ଆକାରର SM (ଛୋଟ) କିମ୍ବା ପ୍ରଶସ୍ତ ଉପରେ ଫ୍ଲୋଟ୍ ଆରମ୍ଭ |

ଭ୍ୟୁପୋର୍ଟ୍ ଆକାରର MD (ମଧ୍ୟମ) କିମ୍ବା ପ୍ରଶସ୍ତ ଉପରେ ଫ୍ଲୋଟ୍ ଆରମ୍ଭ |

ଦୃଶ୍ୟମାନ ଆକାରର LG (ବଡ଼) କିମ୍ବା ବିସ୍ତୃତ ଆକାରରେ ଫ୍ଲୋଟ୍ ଆରମ୍ଭ |

ଦୃଶ୍ୟମାନ XL (ଅତିରିକ୍ତ-ବଡ) କିମ୍ବା ପ୍ରଶସ୍ତ ଦୃଶ୍ୟରେ ଫ୍ଲୋଟ୍ ଆରମ୍ଭ |

html
<div class="float-sm-start">Float start on viewports sized SM (small) or wider</div><br>
<div class="float-md-start">Float start on viewports sized MD (medium) or wider</div><br>
<div class="float-lg-start">Float start on viewports sized LG (large) or wider</div><br>
<div class="float-xl-start">Float start on viewports sized XL (extra-large) or wider</div><br>

ଏଠାରେ ସମସ୍ତ ସମର୍ଥନ ଶ୍ରେଣୀଗୁଡ଼ିକ ଅଛି:

  • .float-start
  • .float-end
  • .float-none
  • .float-sm-start
  • .float-sm-end
  • .float-sm-none
  • .float-md-start
  • .float-md-end
  • .float-md-none
  • .float-lg-start
  • .float-lg-end
  • .float-lg-none
  • .float-xl-start
  • .float-xl-end
  • .float-xl-none
  • .float-xxl-start
  • .float-xxl-end
  • .float-xxl-none

ସାସ୍ |

ଉପଯୋଗିତା API

ଆମର ଉପଯୋଗିତା API ରେ ଫ୍ଲୋଟ୍ ଉପଯୋଗିତା ଘୋଷିତ ହୋଇଛି scss/_utilities.scss| ଉପଯୋଗିତା API କିପରି ବ୍ୟବହାର କରିବେ ଶିଖନ୍ତୁ |

    "float": (
      responsive: true,
      property: float,
      values: (
        start: left,
        end: right,
        none: none,
      )
    ),