Issue 3729 - Make "Block element" dialog adapt to variable window sizes

block.html

Index: block.html
===================================================================
--- a/block.html
+++ b/block.html
@@ -29,13 +29,25 @@
 <script type="text/javascript" src="i18n.js" charset="utf-8"></script>
 <script type="text/javascript" src="block.js" charset="utf-8"></script>
 <style type="text/css">
+  *
+  {
+    box-sizing: border-box;
+  }
+  html
+  {
+    height: 100%;
+  }
   body
   {
     font-family: Arial, Helvetica, sans-serif;

[saroyanm, 2016/03/03 15:29:25]

Detail: Can you please reorder css properties with the order specified in the
https://adblockplus.org/en/coding-style 

[Sebastian Noack, 2016/03/03 15:40:14]

Done, I think.

[saroyanm, 2016/03/03 16:11:34]

Yes only one small note: please move display properties on top.

[Sebastian Noack, 2016/03/03 17:42:32]

I did leave the display property definition below as it is flex-box related,
which I think is also kinda inline with that WordPress article which states to
group similar properties.

     font-size: 13px;
     margin: 0px;
     padding: 5px;
-    display: inline-block;
+    height: 100%;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-flex-direction: column;
+    flex-direction: column;
   }
   #title,
   #filters
@@ -50,13 +62,20 @@
   {
     margin-right: 5px;
   }
+  #title, #buttons
+  {
+    -webkit-flex-shrink: 0;
+    flex-shrink: 0;
+  }
   #filters
   {
-    width: 400px;
+    width: 100%;
     height: 100px;

[saroyanm, 2016/03/03 15:29:25]

while we are using the grow factor I think we can leave height specification to
the browser.

[Sebastian Noack, 2016/03/03 15:40:14]

Yes, for modern browsers, the height doesn't have any effect as this element has
flex-growth and flex-shrink of 1, while all other elements in this flex
container have flex-growth and flex-shrink of 0. I left it in merely for Safari
<=6.0 which doesn't support flexbox. But it's probably fine to just fallback to
the default textarea height there.

     resize: none;
     white-space: pre;
     word-wrap: normal;
+    -webkit-flex-grow: 1;
+    flex-grow: 1;
   }
   #buttons
   {