CSS FLOAT PROPRERTY ISSUE ( GUIDENCE )

Takeshi Okada

Total Post:89

Points:629
Posted by  Takeshi Okada
 915  View(s)
Ratings:
Rate this:
Hi Everyone!

I need some help figuring out why my layout is messy. Here is what i was working on :The Site . The green box should be inside the purple box. I think there is a floating issue. Since i don't fully understand the float rules can someone help me identify the problem and suggest some good "old" documentation reading ?

Thank you!
  1. AVADHESH PATEL

    Post:604

    Points:4228
    Re: CSS float proprerty issue ( guidence )

    Hi Takeshi!

    Float removes the item from the document flow.

    Add an empty <div> or <span> and give it the CSS clear: both;. This will make the div clear the floated element and it's parent will then expand to the full height.

  1. Vijay Shukla

    Post:100

    Points:700
    Re: CSS float proprerty issue ( guidence )

    Hi Takeshi!

    try as below, hope it help you!

    #container:after{
     content: ".";
     clear: left;
     visibility: hidden;
    }

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!