html - Resize of table-cell to zero -


can please this. there's solution without javascript , @media.

image better understanding problem

all details in it, there's no of it. main problem right , left columns resize 0 window/resolution changes, i'm getting hard time it

.table {     min-width: 399px;     width: 100%;     max-width: 100%;     margin: 0 auto;     display: table; } .table-cell-left {     min-width: 0px;     max-width: 9999px;     width: 49%;     display: table-cell;     background-color:#933333;     color: #ffffff;     text-align: center;     vertical-align: middle;     padding: 0 0 0 0; } .table-cell-right {     min-width: 0px;     max-width: 9999px;     width: 49%;     display: table-cell;     background-color:#339933;     color: #ffffff;     text-align: center;     vertical-align: middle; } .table-cell-middle {     min-width: 399px;     max-width: 999px;     width: 2%;     display: table-cell;     text-align: center;     vertical-align: middle;     background-color:#333393;     color: #ffffff; }  <div class="table">     <div class="table-cell-left">         left     </div>     <div class="table-cell-middle">         middle     </div>     <div class="table-cell-right">         right     </div> </div>

jsfiddle example thanks!

.table {     min-width: 399px;     width: 100%;     max-width: 100%;     margin: 0 auto;     display: table; } .table-cell-left {     min-width: 0px;     max-width: 9999px;     width: 49%;        //remove     display: table-cell;     background-color:#933333;     color: #ffffff;     text-align: center;     vertical-align: middle;     padding: 0 0 0 0; } .table-cell-right {     min-width: 0px;     max-width: 9999px;     width: 49%;         // remove     display: table-cell;     background-color:#339933;     color: #ffffff;     text-align: center;     vertical-align: middle; } .table-cell-middle {     min-width: 399px;     max-width: 999px;     width: 2%;         // remove     display: table-cell;     text-align: center;     vertical-align: middle;     background-color:#333393;     color: #ffffff; }

Comments

Post a Comment

Popular posts from this blog

android - MPAndroidChart - How to add Annotations or images to the chart -

i working latest mpandroidchart library , looking way add annotations or images clickable. example: once data reaches value event occurs want able display user - there multiple events can occur annotations (not sure if right word) or image added @ point in chart. any pointers welcome. check documentation of yaxis . focus on setspacetop(...) , setaxismaxvalue(...) methods. for background: bar-shadow , disable calling: barchart.setdrawbarshadow(false) or change color: bardataset.setbarshadowcolor(int color)
Read more

javascript - Add class to another page attribute using URL id - Jquery -

i have attached id url. ex: when click link 1 , has #tab-2 id , takes me landing page. in landing page have find element has #tab-2 id have add class .active . i tried no luck. please 1 correct code. thanks js fiddle link html <div class="menu"> <ul> <li><a href="http://jsfiddle.net/gscyoa0j/1/#tab-2">link 1</a></li> <li><a href="http://jsfiddle.net/gscyoa0j/1/#tab-44">link 2</a></li> <li><a href="http://jsfiddle.net/gscyoa0j/1/#tab-74">link 3</a></li> </ul> </div> landing page <div class="tab"> <ul> <li><a id="tab-2" class="active" >link 1 content</a></li> <li><a id="tab-44" >link 2 content</a></li> <li><a id="tab-74" >link 3 content</a></l
Read more

firefox - Where is 'webgl.osmesalib' parameter? -

i'm trying webgl running on firefox (v37.0.2) via software acceleration mesa. tried following steps have been stated in article: http://www.binarytides.com/enable-webgl-firefox-ubuntu/ however, unable find parameter named ' webgl.osmesalib ' in about:config section? has been removed (or renamed)? if yes, how should instruct firefox use mesa's software acceleration webgl? looks support osmesa removed in favour llvmpipe.
Read more