title: How to get height of UL element when display is set to flex
body: <p>I am doing blockwise segregation of elements of a webpage and drawing border around those blocks but I noticed <code>height</code> will be <code>0</code> if <code>display</code> is set to <code>flex</code>. How can I get the height in such cases? I tried few methods but all give <code>0</code></p>
  
  <pre><code>ul.offsetHeight // gives me 0
  ul.clientHeight // gives me 0
  ul.getBoundingClientRect() //gives me 0
  window.getComputedStyle(ul).height //gives me 100%
  
  //This also gives me 0
  var range = document.createRange()
  range.selectNodeContents(ul)
  range.getBoundingClientRect()
  </code></pre>
  
  <p><strong>EDIT</strong></p>
  
  <p>This is nothing to do with <code>flex</code> property. It was giving <code>0</code> just because it was not visible on the screen only. I don't want to delete the question as already I took few people's time</p>