Home > DeveloperSection > Forums > CSS float proprerty issue ( guidence )
Takeshi Okada
Takeshi Okada

Total Post:89

Points:629
Posted on    April-08-2013 2:58 AM

 CSS-CSS3 CSS-CSS3 
Ratings:


 2 Reply(s)
 719  View(s)
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!


AVADHESH PATEL

Total Post:604

Points:4228
Posted on    April-08-2013 7:53 AM

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.

Vijay Shukla

Total Post:100

Points:700
Posted on    April-08-2013 8:07 AM

Hi Takeshi!

try as below, hope it help you!

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

Don't want to miss updates? Please click the below button!

Follow MindStick