0

Good day everyone. I'm a novice with css and I'm trying to float two div tags within one div tag but I'm getting the following

Screen shot of problem

I gave the parent div tag a light grey background so I know something is wrong somewhere as the background has disappeared just after I floated the div tags.

Here's my css below.

.menu.container {
    width: 100%;
    background-color: #F0F0F0;
}

.category {
    float: left;
}

Thanks a lot for your help!

Mr. Alien
  • 153,751
  • 34
  • 298
  • 278
Adewale Oluyinka
  • 78
  • 1
  • 12
  • Even this will help you http://stackoverflow.com/questions/12871710/why-clear-both-css/12871734#12871734 – Mr. Alien May 10 '14 at 12:28
  • You can use bourbon or sass for easier css implementation. you can take a look at this video how easy this is to build css. https://www.youtube.com/watch?v=8ItNE_DX6Cc – Kostas Drak May 10 '14 at 12:31

1 Answers1

0

when floating elements the parent container does not recieve information about width or height of the floated elements.

if you just want to align sports and News in a horizinal manner then try the following:

.category {
    display:inline-block;
}

"display:inline-block" forms a block element that be on one line with another.

Martin Seitl
  • 628
  • 10
  • 19