Results for “box”
Small, practical examples. Search by task or narrow things down below.
Add depth with a box shadow
CSS: Box shadows are painted outside the box without reserving additional layout space.
CSS✓ Tested
Add inner spacing to a content-sized box
CSS: In content-box sizing, padding adds to the declared content width.
CSS✓ Tested
Align an image within its content box
CSS: Object-position places the rendered object when fitting leaves spare space or crops an edge.
CSS✓ Tested
Arrange children with flexbox
CSS: Learn how to arrange children with flexbox in a complete browser example.
CSS✓ Tested
Bind a checkbox with ngModel
Bind a checkbox with ngModel with a standalone Angular component and explicit browser behavior.
Angular✓ Tested
Cap a box’s width
CSS: Max-width constrains an otherwise larger declared width.
CSS✓ Tested
Center content with flexbox
Center a child along both axes inside a CSS flex container.
CSS✓ Tested
Choose which overlapping box receives a pointer
CSS: Z-index controls the stack level of these positioned sibling elements.
CSS✓ Tested
Clip content that exceeds a fixed-height box
CSS: Overflow hidden clips the painted content while the full content remains in the DOM.
CSS✓ Tested
Control a checkbox
Control a checkbox with a small React component and explicit browser behavior.
React✓ Tested
Fit an entire image inside a differently shaped box
CSS: Contain preserves the image aspect ratio while keeping all of it visible inside the specified content box.
CSS✓ Tested
Move a box visually without changing its layout slot
CSS: Transforms change the painted geometry while leaving surrounding normal-flow layout unchanged.
CSS✓ Tested