Agent skill

css-layout-helper

Explain CSS layout issues and propose fixes. Use when a junior developer is struggling with alignment or spacing.

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/css-layout-helper

SKILL.md

CSS Layout Helper

Purpose

Explain CSS layout issues and propose fixes.

Inputs to request

  • HTML structure and CSS snippet.
  • Desired layout and screenshots.
  • Target browsers and breakpoints.

Workflow

  1. Identify the container and child roles.
  2. Recommend flex or grid with key properties.
  3. Provide a minimal CSS snippet to test.

Output

  • Proposed CSS changes with explanation.

Quality bar

  • Prefer minimal changes over rewrites.
  • Call out responsive implications.

Didn't find tool you were looking for?

Be as detailed as possible for better results