Support » Plugin: Easy FancyBox » Max-Width & Centered Inline Content

  • Resolved bestewar


    I am trying to display inline-content in a Fancybox, centered, at 100% width/max-width 800px. I’ve (for the most part) achieved this by overriding the CSS with my own, but it’s still a bit buggy.

    If you’ll notice on my page: when you click a team thumbnail, the majority of the Fancyboxes display correctly centered, but here are the bugs: initially the boxes start on the left side of the screen and then jump to the middle. Also, randomly, some of the Fancyboxes stay left aligned. I can’t find a rhyme or reason to which boxes display centered and which don’t.

    Is there a setting that automatically could take care of this for me? How about the Pro version? Any help is appreciated, thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author RavanH



    FancybBox was built so all sizing is handled by the script. Overriding this with style rules will mess with script calculations, making for the weird effects you describe.

    The max-width you are looking for, should be your inline content width. It will be a max width because on smaller screens, the script will reduce the window size to fit the screen including a border and margin for the close button and light box effect. Window border and margin sizes can be adjusted on Settings > Media.

    Best to remove all custom styles that affect frame size and do something like this where your max-width is 780px — in this example allowing for another 10px border at each side, making 800px total width:

    <div id="chrisBio" style="width:780px">
    <h3>Chris Brooks</h3>

    Wow, that easy eh? I knew there had to be a simpler version than what I was doing! Thank you so much, works perfectly!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Max-Width & Centered Inline Content’ is closed to new replies.