bluebrint + facebox = IE7 CSS conflict

I’ve seen various projects using the popular blueprint css framework
and the jQuery plugin facebox.

Unfortunately, there exists a conflict between blueprint and the current version of facebox (1.2) which makes the Internet Explorer 7 stretch the popup to the screen width.
Facebox_bluprint_before-after_thumb

To fix this, simply replace


#facebox table {
border-collapse: collapse;
}

with


#facebox table {
border-collapse: collapse;
width: auto;
}

in facebox.css

4 Comments

  1. boudewijn
    Posted May 21, 2009 at 11:11 am | Permalink

    Thank you so very much!

  2. Posted July 11, 2009 at 9:55 pm | Permalink

    Thanks a lot. I’ve spent some time trying to fix this before I found your solution.

  3. Posted July 29, 2009 at 10:10 am | Permalink

    You’re a live saver :)

  4. truewill
    Posted October 1, 2009 at 8:27 pm | Permalink

    i love you!

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">