Fit Adaptive Layout

Ext. layout. container. fit is the basic layout class. The corresponding panel configuration item is named fit. Fit layout will fill the unique sub-elements with containers. If there are multiple sub-panels in the current container, only the first one will be displayed.

ExampleCode:

 <!  Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"  >  <  Html  Xmlns  = "Http://www.w3.org/1999/xhtml"  >  <  Head  Runat  = "Server" >      <  Title  > Ext. layout. Container. Fit example </  Title  >      <  Link  Href  = "Ext-4.0.7-gpl/resources/CSS/ext-all.css"  REL  = "Stylesheet"  Type  = "Text/CSS"   />     <  Script  SRC  = "Ext-4.0.7-gpl/Bootstrap. js"  Type  = "Text/JavaScript"  > </  Script  >      <  Script  Type  = "Text/JavaScript"  >  Ext. onready ( Function  () {Ext. Create (  "  Ext. Panel. Panel  "  , {Title:  "  Ext. layout. Container. Fit example  "  , Frame:  True , Width:  300  , Height:  200  , Renderto: Ext. getbody (), bodypadding:  5  , Layout:  "  Fit  " , Defaults: {bodystyle:  "  Background-color: # ffffff  "  }, Items: [{Title:  "  Nested Panel 1  "  , HTML:  " Panel 1  "  }]}) ;});  </  Script  >  </  Head  >  <  Body  >  </  Body  > </  Html  > 

: