title: AngularJS / CSS - How to set the width of a select box to a value from $scope?
body: <p>I've got two select boxes. The first one is changing the entires of the second one. The second one always adjusts it's length to the longest of the actual entries. But it looks wuite ugly if the width always changes when i select another item of the first box.</p>
  
  <p>Is it possible to set the width of the second box to a fixed value, calculated by the longest element of the whole (non-filtered) second box element list? In the scope I can calculate the number of characters of the longest element. Can I adjust this to the width somehow?</p>
  
  <p>I already tried (for testing)</p>
  
  <pre><code>&lt;select ... style="width:{{getMaxLength()}}px" &gt; &lt;/select&gt;
  </code></pre>
  
  <p>returning the number of characters by the method getMaxLength() in the scope. But it didn't change anything.</p>
  
  <p>Did anyone already try this? Setting the size with ng-attr-size worked, but it's the height which does help me nothing.</p>
  
  <p>I'd appreciate every hint or idea!
  jana</p>
  
  <hr>
  
  <p><strong>Addition:</strong><br>
  My example did not work with the answers because I didn't give the a <strong>"name"</strong> property. Then the answer from <strong>Muhammad Reda</strong> worked fine and I'm sure most of the other ideas will work as well. I found out by very thoroughly comparing Muhammads plunker with my code. That was the only difference.</p>