2. About Me
Technical Evangelist
Microsoft MVP (ASP.NET/IIS)
lohith.nagaraj@telerik.com
@kashyapa
http://www.kashyapas.com
http://www.telerikhelper.net
Lohith G N
http://www.telerik.com
3. Agenda
• What is Responsive Layout?
• Introduction to Telerik UI for ASP.NET AJAX
• Introduction to RadPageLayout
• Demo
5. Responsive Layout
• Adapt your application to client device
• Desktop, Tablet, Mobile Browsers
• 2 ways to achieve responsiveness
• Resize content placeholders
• Hide content placeholders
• Bootstrap
• Client Side Layout System
• Hides content placeholders
6. Media Queries
• Rule to define different style rules for different media
types/devices
• Part of CSS3
• Syntax:
@media screen and (max-width: 300px) {
body {
background-color: lightblue;
}
}
7. UI for ASP.NET AJAX
Complete Toolbox for AJAX Applications
12. RadPageLayout
• AJAX Server Control
• Page Layout Capability
• Simple & Light Weight
• Modelled after Grid System
• Supported Devices
• Extra Large,
• Large,
• Medium,
• Small
• Extra Small
13. Elements
• Container
• Outermost Element Rendered – Div
• Rows
• Containers for Columns.
• <telerik:LayoutRow />
• Columns
• Structural Unit
• <telerik:LayoutColumn />