Direction Column not working with Custom Render and no example has been there.

[venkat-waran]

[Skil3e]

you can pass left and top props on your renderImage like so: renderImage={({photo, left, top, margin}) => ( <CutsomImageComponent left={left} top={top} photo={photo} margin={margin} )} then on you custom component use position absolute and the top and left props. const CustomImageComponent = ({margin, photo, left, top}) => ( <div style={{ width: photo.width, height: photo.height, margin, {/*Use this to apply the column layout*/} position: "absolute", left: left, top: top }}> <img alt={photo.title} width={photo.width} height={photo.height} src={photo.src} /> </div> )

[Vacilando]

@Skil3e thanks this looks promising but I cannot get it working. Could you please post a more functional example or repo that we can work from?

Thanks!

[Skil3e]

@Vacilando here is a codesandbox with a working example Just make sure the photos array has the width and the height of the photos. https://codesandbox.io/s/direction-column-react-photo-gallery-wc158

[Vacilando]

Thanks, @Skil3e, it works now. Much appreciated!