Arrow Alignment & Centering Main Image

[brittanysteed]

Hey Abhiomkar!

Thanks for the awesome plugin!

I'm having two issues:

• Centering the main image (setting offset.left to -320 didn't change anything)
• My right arrow refuses to be centered (see image)(https://cloud.githubusercontent.com/assets/9554385/4902353/cf3331e4-6438-11e4-978d-49605c2cb95f.PNG)

This is all without any tinkering. Just copying and pasting the setup from your site. I didn't even add my own images yet. I can't figure out what it is!

Thanks for anyone's time in advance!

[abhiomkar]

Hello! could you please share the markup and browser information?

Thanks!

[abhiomkar]

btw, the option is offsetLeft (not offset.left).

[brittanysteed]

Sure! Thanks for the timely response! You can see an edited version at www.brittanysteed.com

and browser info? like my IP address? 68.202.205.202

<div id="gallery-container" style="padding-bottom:5%">
<div id="gallery">
        <img data-src="images/gallery/1.jpg" />
        <img data-src="images/gallery/2.jpg" />
        <img data-src="images/gallery/3.jpg" />

</div>
</div>

<script>
    $(document).ready(function() {
            var p = $("#gallery").portfolio({
                enableKeyboardNavigation: true, // enable / disable keyboard navigation (default: true)
                loop: true, // loop on / off (default: false)
                easingMethod: 'easeOutQuad', // other easing methods please refer: http://gsgd.co.uk/sandbox/jquery/easing/
                height: '400px', // gallery height
                width: '100%', // gallery width in pixels or in percentage
                lightbox: false, // dim off other images, highlights only currently viewing image
                showArrows: true, // show next / prev buttons
                logger: false, // for debugging purpose, turns on/off console.log() statements in the script
                spinnerColor: '#000', // Ajax loader color
                offsetLeft: -320, // position left value for current image
                opacityLightbox: '0.1' // opacity of other images which are not active
            });
            p.init();
    });
</script>

I also have this in my css if it's relevant

#gallery {
    overflow-x: visible !important;
    font-size: 0;
}