Grow your CSS skills. Land your dream job.

Improvement on ghost element centering technique

  • # April 16, 2013 at 10:30 am

    Hi,

    When working on a responsive landing page I ran into a weird issue with the ghost element centering technique that is documented here:

    http://css-tricks.com/centering-in-the-unknown/

    Where in Firefox and IE9 the centered element would collapse beneath the ghost element in narrower desktop browsers. I scoured the internet and the comments thread of the above article and came up with nothing. A coworker suggested using white-space: nowrap on the containing element, and sure enough this fixed the problem! Needless to see I was super happy and wanted to share in case someone else is banging their heads against the wall with this.

    A simple use case is here: http://codepen.io/tranzfuse/full/EBFzy

    Hopefully this helps someone else out.

    Cheers,

    Adam

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".