Can't override inline-block positioning in FadeIn component div

[Nedelstein]

I have a grid of images and I would like to have them fade in using react-lazyload-fadein but I can't change the preset Div from inline-block to the needed inline. Below does not work:

<FadeIn height={100} style={{ display: "inline !important" }}> {(onload) => ( <Link to={projectNames[index]}> <img onLoad={onload} style={imgStyle} className="projectImg" src={IMG(projects[index])} alt="nope" onMouseEnter={() => { setTitle(projectTitle[index]); setSkills(projectSkills[index]); document.getElementById(projects[index]).style.opacity = "1"; }} onMouseLeave={() => { setTitle(null); setSkills(null); document.getElementById(projects[index]).style.opacity = "0"; }} ></img> <div id={projects[index]} className="projTitle"> {title} <div style={{ marginTop: "2%", fontSize: "0.8rem" }}> {skills} </div> </div> </Link> )} </FadeIn>

[arsamshokrian]

Any solution found? I'm facing the same issue and while I found a solution for LazyLoad, I couldn't apply the same solution to FadeIn.

[Nedelstein]

unfortunately no. i ended up scrapping react-lazyload-fadein and going in a different direction.