Unable to style the div on simulator only on dev tools

Hi everyone,

I'm currently styling my Hero slice via simulator. I'm trying to get a very basic heading to be overlayed on my image. Using position relative then position absolute the expected behavior should work. however nothing changes in simulator so when I tried rendering it on local host i played around with the dev tools by clearing out the div with the position absolute and manually added position absolute, top-20, left-42 and it worked! How come it won't in my editor or simulator? see code below:

  <div className="relative">
    <div className="absolute top-[20rem] left-[42rem]">
    <PrismicNextImage field={slice.primary.hero_image} />


export default Hero;

any tips are much appreciated as I'm just starting out in Prismic!!

Hi Odelia,

Does your tailwind config include all the content folders described in our sample projects?


Hey Phil,

Thanks so much! This solved my issue. I didn't have src/slices/etc. added to module.exports. big life saver!

1 Like