मेरे पास कार्ड है जिसकी पृष्ठभूमि में छवि है

  <div class="col-12 col-sm-8 col-md-6 col-lg-4 mt-4">
    <div class="card">

      <img class="card-img" style=" filter: brightness(75%);" src="{{$category->photo}}">
      <div class="card-img-overlay text-white d-flex flex-column justify-content-center">
        <a class="text-right"><i class="fas fa-pen"></i></a>
        <h1 class="card-title text-white text-center ">{{$category->name}}</h1>
      </div>
    </div>
  </div>

पेन आइकन है जिसे मैं ऊपरी दाएं कोने पर रखना चाहता हूं

enter image description here

0
Swift Solutions 22 नवम्बर 2021, 06:15

1 उत्तर

सबसे बढ़िया उत्तर

स्थिति उपयोगिता वर्गों का प्रयास करें।

https://getbootstrap.com/docs/5.1/utilities/position/

उदाहरण के लिए:

<div class="card position-relative">
  <!-- other elements -->
  <a class="text-right position-absolute top-0 end-0"><i class="fas fa-pen"></i></a>
</div>

CSS स्थिति के बारे में अधिक जानें: https://developer.mozilla.org/ en-US/docs/वेब/सीएसएस/स्थिति

1
AJcodez 22 नवम्बर 2021, 06:34