Skip to content

SyntaxHighlighter Inside Masonry items causes vertical spacing inconsistensies #246

Closed
newtonianb opened this Issue Sep 9, 2012 · 2 comments

2 participants

@newtonianb

Whenever I place a 'syntaxhighlighter' div element inside a mansory item element I get vertical glitches. I am thinking it could be due to the horizontal scrollbar that 'syntaxhighlighter' creates? I tried to look at the mansory code and the furthest I got was on line 289 it is not getting set correctly
var setHeight = minimumY + $brick.outerHeight(true),

A demo of what I am talking about here:
http://jsfiddle.net/PaXSA/

syntaxhighlighter librrary:
http://alexgorbatchev.com/SyntaxHighlighter/

@desandro
Owner
desandro commented Sep 9, 2012

Thank you for providing an example!!

SyntaxHighlighter.all() listens for window.load so it will be triggered after Masonry, which is triggered on $(document).ready(). A good solution would be to trigger SyntaxHighlighter.highlight() within $(document).ready().

        $(document).ready(function() {
              SyntaxHighlighter.highlight();
              $('#mcontainer').masonry({
                itemSelector : '.item'
              });
        });

See http://jsfiddle.net/desandro/PaXSA/2/

@desandro desandro closed this Sep 9, 2012
@newtonianb

Makes sense, thanks so much!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.