Всегда устанавливать ширину одного элемента в ширину другого

Question

Я знаю, как получить ширину одного элемента и установить ширину другого элемента при загрузке страницы (см. введите описание ссылки здесь ).

Но если ширина стороны изменяется (например, при изменении размера окна браузера), ширина элемента не изменится.

Как я могу "связать" ширину одного элемента с другим братом / элементом?

Answer 1

Может быть так:

function set_elements_width(_selector){
	var max_width = 0;
	$(_selector).each(function(){
		  var el_width = $(this).width();
		  if(max_width < el_width){
		  	  max_width = el_width;
		  }
	});
	$(_selector).css({'width': max_width});
}

function set_different_width(){
  /* this function for test only */
  $('label:eq(0)').css('width', 10);
  $('label:eq(1)').css('width', 20);
  $('label:eq(2)').css('width', 30);
  $('label:eq(3)').css('width', 25);
}



$(window).resize(function(){
    set_elements_width('label');
});

$(document).ready(function(){
	set_elements_width('label');
});

/* for test only */
label{
       	  border-style:solid;
       	  border-width:1px;
       	  display:inline-block;
       	  overflow:hidden;
       	  padding:2px;
  }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<label style="width:10px;">111</label>
<label style="width:20px;">222</label>
<label style="width:30px;">222</label>
<label style="width:25px;">000</label>
<br/>
<input type="button"  value="set different widths" onclick="set_different_width();"/>
<input type="button"  value="set same width" onclick="set_elements_width('label');" />