Floated elements must specify its width?


#1

Floated elements must have a width specified, as in the example above. Otherwise, the element will assume the full width of its containing element.

I can’t understand it. If the width of floated element is not specified, the element will assume the full width of its containing element? What does it mean?
https://www.codecademy.com/courses/learn-css-display-positioning/lessons/css-display-positioning/exercises/css-float?action=resume_content_item&course_redirect=learn-css

The link is here. Actually, the .box-bottom didn’t specify its width, so no “example above” for reference.

Thanks for your help.


#2

float is a typesetting term that describes how text floats around a picture, filling in the open space beside and below. The page section is larger than the picture.

<section>
  <div>

  </div>
</section>

Above, the div will inherit the width of the section if none is specified on that object. In that case, float will appear to have no effect. The width of the div is expected to be smaller than the section.


#3

Got it! Thank you so much!:grinning: