Menú
De forma predeterminada está seleccionado el prompt que primero revisa el origen. Puedes cambiar a un comando directo o descargar una copia local.
Lee SKILL.md y los archivos complementarios que muestra SkillsMP antes de decidir si quieres instalarlo.
Instalar con Codex o Claude Copia este prompt, pégalo en Codex, Claude u otro asistente, y deja que revise la página de la skill y la instale por ti.
Un comando directo omite el prompt de revisión. Revisa el origen antes de ejecutarlo.
npx skills add https://github.com/dipro-vn/dipro-ai-boost --skill html-css-css-layoutEl comando permanece en una sola línea. Desplázate horizontalmente para revisarlo antes de copiarlo.
¿Prefieres una copia local? Descarga los archivos que SkillsMP tiene disponibles ahora.
Basado en la clasificación ocupacional SOC
Mostrando SKILL.md
| name | html-css-css-layout |
| description | null |
Category: html-css · Status: 🟢 Active
Khi dàn layout: chọn giữa Flexbox và Grid, căn chỉnh phần tử.
gap để tạo khoảng cách, không dùng margin thủ công giữa item.justify-content/align-items, tránh position: absolute để center.--space-4), tránh magic number.repeat(auto-fit, minmax()) cho lưới tự co.width cố định cho container; ưu tiên max-width + margin-inline: auto..toolbar {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--space-3);
}
.grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: var(--space-4);
}
Good: gap cho spacing, auto-fit minmax cho lưới responsive, token cho khoảng cách.
Avoid: margin-right: 17px rải rác, center bằng position: absolute; top: 50%.
gap thay margin giữa itemmax-width thay width cứng