Images are overflowing
YeonjuSeo opened this issue · 2 comments
YeonjuSeo commented
I'm trying to render one notion page.
Font size is fine but the images are getting bigger than the wrapper and the layout isn't working properly. I don't know what to do Plz help me.
And this is the react-notion page:
This is my code:
<StyledNotionWrapper>
{isNotionContent && <NotionRenderer blockMap={notionData} />}
</StyledNotionWrapper>
const StyledNotionWrapper = styled.div`
width: 792px;
max-width: 792px;
font-size: 0.2rem;
`;
dimitrisraptis96 commented
These CSS classes fixed the issue for me @YeonjuSeo :
.notion,
.notion img,
.notion-asset-wrapper {
max-width: 100%;
}
.notion-asset-wrapper > div {
padding-bottom: 0 !important;
}
YeonjuSeo commented
Oh god Thank you so much!! It worked for me!!