How Can I Make a Parent Div Automatically Expand to the Height of Its Children Using CSS?-CSS Tutorial-php.cn

How Can I Make a Parent Div Automatically Expand to the Height of Its Children Using CSS?

Expanding a Parent

to the Height of Its Children with CSS

In order to automatically expand the height of a parent

to match the height of its child elements, CSS can be utilized effectively. Consider the following page structure:

<body>
  <div>

Copy after login

To achieve the desired expansion, simply use the following CSS for the parent

overflow: auto;

Copy after login

Furthermore, if the child content expands beyond the browser window's width, causing a horizontal scrollbar to appear on the parent

, you can modify the CSS to the following:

Parent:

overflow: auto;

Copy after login

Child:

display: table-row;

Copy after login

The above is the detailed content of How Can I Make a Parent Div Automatically Expand to the Height of Its Children Using CSS?. For more information, please follow other related articles on the PHP Chinese website!

source：php.cn

Previous article：Can CSS `:before` and `:after` Selectors Insert HTML Content? Next article：Why Do Transparent Borders Distort Linear Gradients, and How Can I Fix It?

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn