YouTip LogoYouTip

Home > HTML > Att Dir Compact

Att Dir Compact

📅 2026-06-14 | 📂 HTML
# HTML `compact` Attribute The `compact` attribute of the `` tag is a legacy HTML attribute used to render directory lists in a more compact form. This comprehensive reference explains the purpose of the `compact` attribute, its deprecation status, browser compatibility, and modern CSS alternatives. --- ## Introduction In older versions of HTML, the `` element was used to create directory lists (typically short lists of items). The `compact` attribute is a boolean attribute that instructed browsers to render the list more compactly by reducing line spacing and indentation. > ⚠️ **Important Deprecation Notice:** > * The `` tag itself is **obsolete** and is not supported in HTML5. > * The `compact` attribute was deprecated in HTML 4.01 and is completely unsupported in modern web standards. > * For modern web development, you should use the standard `
    ` (unordered list) tag and style it using **CSS**. --- ## Syntax ### HTML Syntax In HTML, boolean attributes can be written by just specifying their name: ```html
  • HTML
  • CSS
    •  ``` ### XHTML Syntax In XHTML, attribute minimization is forbidden. The attribute must be defined with its value: ```xml
  • HTML
  • CSS
    •  ``` --- ## Code Examples ### Legacy HTML Example (Deprecated) Below is how the `compact` attribute was historically used within a `` element: ```html
  • HTML
  • XHTML
  • CSS
    •  ``` ### Modern CSS Alternative (Recommended) Since both `` and its `compact` attribute are obsolete, you should use a standard unordered list (`
      `) and control the spacing using CSS properties like `line-height`, `margin`, and `padding`. ```html
      • HTML
      • XHTML
      • CSS
      ``` ```css /* CSS to achieve a compact list layout */ .compact-list { line-height: 1.2; /* Reduces vertical spacing between lines */ padding-left: 20px; /* Adjusts indentation */ margin: 5px 0; /* Reduces spacing above and below the list */ } ``` --- ## Browser Support | Attribute | Chrome | Firefox | Safari | Edge / IE | Opera | | :--- | :---: | :---: | :---: | :---: | :---: | | `compact` | ❌ Not Supported | ❌ Not Supported | ❌ Not Supported | ❌ Not Supported | ❌ Not Supported | *Note: Modern browsers do not support or apply any default styling for the `compact` attribute on `` or `
        ` elements. They will render the list with standard default spacing unless overridden by CSS.* --- ## Key Considerations 1. **Semantic HTML:** Always use `
          ` (unordered list) or `
            ` (ordered list) instead of the obsolete `` tag. 2. **Separation of Concerns:** Presentation styles (like making a list compact) should always be handled in your stylesheet (CSS) rather than via HTML attributes. Use the CSS `line-height` and `margin` properties to customize list density.
← Att Div AlignAtt Dialog Open →

📂 Categories