CSS Flexbox lets you create webpages with elements, controls, forms, toolbars, and menus that can resize and reposition themselves when the user changes the size of the browser window. This can help you design more flexible webpages that can automatically adapt to changing browser windows. As the window changes, you can control what the user sees, rather than just having elements and text truncated as a windows shrinks.
This sample demonstrates two ways CSS Flexbox can be used to create menus, toolbars, and controls of screen elements that resize according to the application’s layout.
The Flexbox Toolbar example shows how a toolbar can change orientation as the browser window change in size to keep as much content displayed for the user.
The Flexbox item collection example shows how Flexbox can be used to create a simple collection to hold elements such as images and text boxes. When the screen resizes, Flexbox creates more or fewer lines of elements and wraps the element collection as needed. As less and less room is available horizontally, the layout puts more items on more lines.
The view source option lets you see a preview of the CSS code that controls how the collection is laid out.
Reference
CSS Flexible Box ("Flexbox") Layout
Conceptual
Internet Explorer 10 Developer Guide: CSS Flexible box ("Flexbox") layout
Internet Explorer Testing Center
CSS Flexible Box
The Internet Explorer Samples Gallery contains a variety of code samples that demonstrate new features available in Internet Explorer. These downloadable samples are provided as compressed ZIP files that contain the HTML, JavaScript, CSS, and image resources for the sample, along with the license agreement and sample description metadata. After you’ve downloaded and unzipped the compressed files, the sample files can be found in the following location:
(unzipped folder)\HTML,JavaScript\Website \(Sample)
This sample is provided as-is in order to indicate or demonstrate the functionality of the feature APIs for Internet Explorer 10. We appreciate your comments and questions on this sample!
For download info, visit Internet Explorer downloads.