blockStarts on a new line and takes up the full width available. Respects width and height properties.<div>, <p>, <h1> to <h6>, <section>inlineSits in line with other elements without forcing a new line. Ignores top/bottom margins and explicit width/height.<span>, <a>, <strong>, <em>inline-blockSits in line like an inline element, but allows you to set custom width, height, and vertical spacing like a block element.<img>, <input>, <button>noneCompletely hides the element and removes it from the page layout structure. It takes up zero space.None (manually applied)Modern Layout Valuesflex: Turns the element into a flex container. This activates Flexbox layout basics for organizing children linearly in rows or columns.grid: Turns the element into a grid container. This builds a rigid, multi-dimensional grid framework of rows and columns for its children.contents: Makes the container box "disappear" conceptually. Its direct children jump up a level and layout as if they were direct children of the parent instead.
blockStarts on a new line and takes up the full width available. Respects width and height properties.<div>, <p>, <h1> to <h6>, <section>inlineSits in line with other elements without forcing a new line. Ignores top/bottom margins and explicit width/height.<span>, <a>, <strong>, <em>inline-blockSits in line like an inline element, but allows you to set custom width, height, and vertical spacing like a block element.<img>, <input>, <button>noneCompletely hides the element and removes it from the page layout structure. It takes up zero space.None (manually applied)Modern Layout Valuesflex: Turns the element into a flex container. This activates Flexbox layout basics for organizing children linearly in rows or columns.grid: Turns the element into a grid container. This builds a rigid, multi-dimensional grid framework of rows and columns for its children.contents: Makes the container box "disappear" conceptually. Its direct children jump up a level and layout as if they were direct children of the parent instead.
blockStarts on a new line and takes up the full width available. Respects width and height properties.<div>, <p>, <h1> to <h6>, <section>inlineSits in line with other elements without forcing a new line. Ignores top/bottom margins and explicit width/height.<span>, <a>, <strong>, <em>inline-blockSits in line like an inline element, but allows you to set custom width, height, and vertical spacing like a block element.<img>, <input>, <button>noneCompletely hides the element and removes it from the page layout structure. It takes up zero space.None (manually applied)Modern Layout Valuesflex: Turns the element into a flex container. This activates Flexbox layout basics for organizing children linearly in rows or columns.grid: Turns the element into a grid container. This builds a rigid, multi-dimensional grid framework of rows and columns for its children.contents: Makes the container box "disappear" conceptually. Its direct children jump up a level and layout as if they were direct children of the parent instead.
blockStarts on a new line and takes up the full width available. Respects width and height properties.<div>, <p>, <h1> to <h6>, <section>inlineSits in line with other elements without forcing a new line. Ignores top/bottom margins and explicit width/height.<span>, <a>, <strong>, <em>inline-blockSits in line like an inline element, but allows you to set custom width, height, and vertical spacing like a block element.<img>, <input>, <button>noneCompletely hides the element and removes it from the page layout structure. It takes up zero space.None (manually applied)Modern Layout Valuesflex: Turns the element into a flex container. This activates Flexbox layout basics for organizing children linearly in rows or columns.grid: Turns the element into a grid container. This builds a rigid, multi-dimensional grid framework of rows and columns for its children.contents: Makes the container box "disappear" conceptually. Its direct children jump up a level and layout as if they were direct children of the parent instead.
blockStarts on a new line and takes up the full width available. Respects width and height properties.<div>, <p>, <h1> to <h6>, <section>inlineSits in line with other elements without forcing a new line. Ignores top/bottom margins and explicit width/height.<span>, <a>, <strong>, <em>inline-blockSits in line like an inline element, but allows you to set custom width, height, and vertical spacing like a block element.<img>, <input>, <button>noneCompletely hides the element and removes it from the page layout structure. It takes up zero space.None (manually applied)Modern Layout Valuesflex: Turns the element into a flex container. This activates Flexbox layout basics for organizing children linearly in rows or columns.grid: Turns the element into a grid container. This builds a rigid, multi-dimensional grid framework of rows and columns for its children.contents: Makes the container box "disappear" conceptually. Its direct children jump up a level and layout as if they were direct children of the parent instead.
blockStarts on a new line and takes up the full width available. Respects width and height properties.<div>, <p>, <h1> to <h6>, <section>inlineSits in line with other elements without forcing a new line. Ignores top/bottom margins and explicit width/height.<span>, <a>, <strong>, <em>inline-blockSits in line like an inline element, but allows you to set custom width, height, and vertical spacing like a block element.<img>, <input>, <button>noneCompletely hides the element and removes it from the page layout structure. It takes up zero space.None (manually applied)Modern Layout Valuesflex: Turns the element into a flex container. This activates Flexbox layout basics for organizing children linearly in rows or columns.grid: Turns the element into a grid container. This builds a rigid, multi-dimensional grid framework of rows and columns for its children.contents: Makes the container box "disappear" conceptually. Its direct children jump up a level and layout as if they were direct children of the parent instead.