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

CSS

Posted by Nicholas Wimsatt
Nicholas Wimsatt
4,633 Points

CSS question

I am working on a new responsive template design of my company website KKG. Taking out most of the template images and replacing it with CSS code. I have hit a roadblock on my CodePen example as I am using JQuery to calculate the height of the content_shadow div. What I would like to do is remove the JQuery code but keep the height of content_shadow div the same as content_middle div using CSS.

I encourage anyone to try and crack it, or give me a better alternative than what I am currently using. Totally open to suggestion.

1 Answer

Paul Graham
Paul Graham
1,396 Points
Paul Graham
Paul Graham
1,396 Points

Using straight CSS, your only option is to set the heights to static values.

Nicholas Wimsatt
Nicholas Wimsatt
4,633 Points

Yeah, that crossed my mind. I was aiming for a dynamic height rather than fixed as the content authors might add text that will surpass the static values. I was hoping the Calc() function could pull the height values from neighboring DOM elements but from what I gathered it can only do simple mathematics.

James Barnett
James Barnett
39,199 Points

Considering graceful degradation I'd say use JavaScript instead of calc. The layout would break in IE8 and other older browsers and that's no good.