0

I need some clarity about CSS styling. Let's create a simple example. I have a header div container at the top of the page. I then fill this container with two other div tags, a logo div and a menu div.

When I use Firebug or press F12 in another browser to inspect the div tags, and especially the parent div header, I can hover above the code and the div elements get highlighted in color.

But when I set the logo div CSS property to float: left and the menu div CSS property to float: right, the parent div header, don't get highlighted any more! Despite that I set the following div element CSS property to clear: both. Is this OK, or am I doing something wrong in my CSS? If I set a hight to the parent div, it's highlighted again.

Is there a error in the CSS, when I can't highlight the element? It's often I get this kind of "errors" when I use CSS.

3D-kreativ
  • 9,053
  • 37
  • 102
  • 159
  • You may be interested in this question - ["What is a clearfix?"](http://stackoverflow.com/questions/8554043/what-is-clearfix) – Josh Crozier Feb 24 '15 at 21:39
  • 2
    The element with `clear` must be inside the header too .... I suggest use the pseudo-element after clearfix. – DaniP Feb 24 '15 at 21:40

1 Answers1

0

Add overflow:hidden or overflow:auto to the parent div's style/class and that will stretch the div so that the child divs actually sit inside it.

Daniel Williams
  • 2,195
  • 7
  • 32
  • 53