Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Josh Curtis
Josh Curtis
7,782 Points

Help with a collapsing div!

I have a very strange problem that I can't figure out. I built an entire single page website and everything was fine. I was proof reading all of the html and realized that I accidentally put an external script link BEFORE my <!DOCTYPE html> (very beginning of page. No idea how it got there). Of course I removed it but when I viewed the page again (via brackets live preview) my div heights are all off. No value I enter will change their heights. I have messed with all of the HTML and CSS and nothing will fix it. I can put anything before the <!DOCTYPE html> (a single letter, div etc) and everything goes back to normal. What am I missing?? I can post the code if you need but its an entire site... thanks in advance!!

jag
jag
18,266 Points

The code that is responsible for the collapsing is needed to help.

3 Answers

anil rahman
anil rahman
7,786 Points

Are you floating anything? This is a big cause of elements collapsing if thats the case you need a clear fix.

.clearfix::after {
   content: "";
   display: table;
   clear: both;
}

That class would then go in the collapsing div.

Josh Curtis
Josh Curtis
7,782 Points

I'll try that out anil. Thanks.

Josh Curtis
Josh Curtis
7,782 Points

If anyone is having issues like this, here is how i solved my problem. My doctype was messed up from the beginning so I ended up building the entire site in "Quirks Mode". All I had to do was fix the doctype (which put me back in "strict mode") and a few of my css properties and everything was fine.