JSFiddle - React, Tailwind, and code Playground

HTML

<div class="card">
   <div class="tag">Developing</div>
   <div class="tag">Busniess</div>
   <div class="tag">Web Design</div>

   <div class="tag">Busniefss</div>
    <div class="tag">Busffniess</div>
   <div class="tag">Web ffDesign</div>
   <div class="counter-tag hidden"></div>
</div>

<div class="card">
   <div class="tag">Developing</div>
   <div class="tag">Busniess</div>
   <div class="tag">Web Design</div>

   <div class="tag">Busniefss</div>
   <div class="tag">Web ffDesign</div>
   <div class="counter-tag hidden"></div>
</div>

<div class="card">
   <div class="tag">Developing</div>
   <div class="tag">Busniess</div>
   <div class="tag">Web Design</div>

   <div class="tag">Busniefss</div>
   <div class="counter-tag hidden"></div>
</div>

CSS

.card {
  padding: 5px;
  width: 60%;
  height: 300px;
  border: 2px solid blue;
  display: flex;
  flex-direction: row;
  gap: 5px;
}
.hidden {
  display: none;
}

.tag, .counter-tag {
  padding: 5px 8px;
  color: #2C3C93;
  background: rgb(44, 60, 147, 0.1);
  height: 20px;
  flex-shrink: 0;
}

JavaScript

const counterElementWidth = 30;
function collapseTags() {
	document.querySelectorAll('.card').forEach(card => {
    let counterTag = card.querySelector('.counter-tag');
  
  	let cardStyle = getComputedStyle(card);
    let padding = parseFloat(cardStyle.paddingLeft) + parseFloat(cardStyle.paddingRight);
    let innerWidth = card.clientWidth - padding;
    
    let usedWidth = 0;
		let tagsLeft = 0;

		card.querySelectorAll('.tag').forEach(tag=>{
			usedWidth += tag.getBoundingClientRect().width;
			if(usedWidth >= innerWidth - counterElementWidth) {
      	tag.classList.add('hidden');
        tagsLeft++;
      } else {
      	tag.classList.remove('hidden');
      }
    });
    
    if(tagsLeft > 0) {
      counterTag.classList.remove('hidden');
      counterTag.innerHTML = `+${tagsLeft}`;
    } else {
    	counterTag.classList.add('hidden');
    }
    
  });
}
collapseTags();
window.addEventListener('resize', collapseTags);