Layout

UWP Controls and Layout

How UWP's layout panels and built-in controls work together, including Grid sizing, RelativePanel, and ListView virtualization.

Silverlight Layout Panels

How Grid, StackPanel, Canvas, and other panels arrange and size Silverlight UI content through the measure/arrange layout pass.

XAML Layout Panels

An overview of the core layout panels in XAML — StackPanel, WrapPanel, Grid, DockPanel, and Canvas — and how each one arranges child elements.

Layout Panels Overview

An introduction to how WPF's layout system works and how panel classes cooperate to size and position UI elements.

Layout Pages in Web Pages

How shared layout pages, the RenderBody and RenderSection methods, and reusable partial views let ASP.NET Web Pages sites keep a consistent header, footer, and…

Master Pages

Understand how ASP.NET Web Forms master pages provide a shared, reusable layout that individual content pages fill in via ContentPlaceHolder regions.

Layouts and Partial Views

Learn how _Layout.cshtml provides a shared page shell via RenderBody/@RenderSection, and how partial views let you reuse smaller markup fragments across views.

The Postman Interface

A tour of Postman's main workspace layout — sidebar, request builder, response viewer, and console — and how each panel supports the request-response workflow.

MAUI Layouts

How Grid, StackLayout, FlexLayout, and AbsoluteLayout measure and arrange child views, and when to choose each for performance and responsiveness.

Layout with pack, grid, and place

How Tk's three geometry managers—pack, grid, and place—control widget positioning and sizing, and when to use each.

CSS Units for Layout (px, %, rem, em, vh/vw)

How absolute and relative CSS length units differ and when to use px, %, rem, em, and viewport units in layouts.

What Is the CSS Box Model?

The CSS box model describes every rendered element as a set of nested rectangular layers — content, padding, border, and margin — and how those layers combine…

CSS Flexbox vs Grid: What Is the Difference?

Flexbox is a one-dimensional layout system for arranging items along a single row or column with flexible sizing, while CSS Grid is a two-dimensional system th…

What Are the CSS Position Values and How Do They Differ?

The CSS position property controls how an element is placed in the document: static is the default normal flow, relative offsets an element from its own origin…

How Do z-index and Stacking Contexts Work?

z-index controls the paint order of positioned elements along the axis perpendicular to the screen, but it only works within a stacking context, which is a sel…

What Are the Core Principles of Responsive Web Design?

Responsive design means building a single layout that adapts to any viewport using fluid grids, flexible images, and CSS media queries, rather than shipping se…

How Does CSS Grid grid-template-areas Work?

`grid-template-areas` lets you name regions of a CSS Grid layout as a visual ASCII-art string on the container, then assign each child to one of those named re…

What Do justify-content, align-items, and align-self Do in Flexbox?

`justify-content` aligns flex items along the main axis (the flex-direction), `align-items` aligns items along the cross axis for the whole container, and `ali…

What Are CSS Container Queries and How Do They Differ from Media Queries?

Container queries let an element style itself based on the size of its nearest containing ancestor rather than the size of the entire viewport, using `containe…

What Is the Browser Rendering Pipeline?

The browser rendering pipeline is the sequence of steps — style, layout, paint, and composite — a browser runs to turn HTML, CSS, and DOM state into pixels on…