Beshal Jaenal Beshal Jaenal - 30 days ago 9
HTML Question

parent element not following child element

When we set up a parent element, and increment the contents of the child elements, shouldn't the size of the parents automatically scale to fit the child?

In contrast, the parent having applied the css properties, such as background given to it, does not scale for the parent. Here is my attempt to creating a 3 column simple layout, and the parent not scaling, and hence the border bottom is not being applied:

REPL.IT

As you can see, the contents are overflowing the parent and everything is not enclosed within the parent. How should I fix this?

Answer Source

What you need is a clearfix on your #bodytext because all your content floats.

Add the following lines to your #bodytext:

#bodytext{
  overflow: auto;
  zoom: 1;
}

For a better understanding, why you need a clearfix, read this answer.