flexbox - Material design sidenav: a div prevents correct flex - [RESOLVED] -


can codepen addition of div markup preventing nice arrangement of elements?

what want image , 'should show' message visible , list fill out remaining space in sidenav.

the core challenge in html.

 <md-sidenav md-is-locked-open="$mdmedia('gt-sm')" class="sidenav md-sidenav-left md-whiteframe-z2" layout="column">     <header>       <img src="https://dl.dropboxusercontent.com/u/240178989/images/artichoke_lg2.png" />     </header>      <div class="toolong">       <ul flex>         <li ng-repeat="i in series">entry {{i}}</li>       </ul>       <h2>should show</h2>     </div>   </md-sidenav> 

worth noting angular material website has after cannot find within code clue solve this.

using following seems sort of work, you'll idea... is, if understood correctly question. i've added flex in bottom h2, , added overflow:scroll in entries div.

<div class="toolong" style="overflow:scroll">   <ul flex>     <li ng-repeat="i in series">entry {{i}}</li>   </ul> </div> <h2 flex>should show</h2> 

Comments

Popular posts from this blog

java - UnknownEntityTypeException: Unable to locate persister (Hibernate 5.0) -

python - ValueError: empty vocabulary; perhaps the documents only contain stop words -

ubuntu - collect2: fatal error: ld terminated with signal 9 [Killed] -