examples/layout/table.html

   1 <html>\r
   2 <head>\r
   3     <title>Table Layout</title>\r
   4     <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css"/>\r
   5 \r
   6     <!-- GC -->\r
   7     <!-- LIBS -->\r
   8     <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
   9     <!-- ENDLIBS -->\r
  10 \r
  11     <script type="text/javascript" src="../../ext-all.js"></script>\r
  12 \r
  13     <style type="text/css">\r
  14         html, body {\r
  15             font: normal 11px verdana;\r
  16         }\r
  17         #main-panel td {\r
  18             padding:5px;\r
  19         }\r
  20     </style>\r
  21     <script type="text/javascript">\r
  22         Ext.onReady(function() {\r
  23             var panel = new Ext.Panel({\r
  24                 id:'main-panel',\r
  25                 baseCls:'x-plain',\r
  26                 renderTo: Ext.getBody(),\r
  27                 layout:'table',\r
  28                 layoutConfig: {columns:3},\r
  29                 // applied to child components\r
  30                 defaults: {frame:true, width:200, height: 200},\r
  31                 items:[{\r
  32                     title:'Item 1'\r
  33                 },{\r
  34                     title:'Item 2'\r
  35                 },{\r
  36                     title:'Item 3'\r
  37                 },{\r
  38                     title:'Item 4',\r
  39                     width:410,\r
  40                     colspan:2\r
  41                 },{\r
  42                     title:'Item 5'\r
  43                 },{\r
  44                     title:'Item 6'\r
  45                 },{\r
  46                     title:'Item 7',\r
  47                     width:410,\r
  48                     colspan:2\r
  49                 },{\r
  50                     title:'Item 8'\r
  51                 }]\r
  52             });\r
  53         });\r
  54     </script>\r
  55 </head>\r
  56 <body>\r
  57 <script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->\r
  58 </body>\r
  59 </html>\r