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

table cell over-spilling parent element

Hi all,

I want to horizontally and vertically center some text within a div element. I have chosen the table, table-cell method as the absolute, top:0; right:0; bottom:0; left:0; margin: auto system didn't work in this instance. I have saved out the code in Code-pen http://codepen.io/anon/pen/FzpGC for you to take a look at.

As you can see in the example the table width is spilling out of it's parent element - therefore the text it contains will not be truly centered in its parent element.

Is there a fix or have I forgotten something???

1 Answer

I've sorted it now. Text string was to long and the break points were the problem pushing the table and table-cell elements outside of the parent.