React Changing Route Breaks Height With Layout
I have a React application where if I change the route to a page with a small height the entire body doesn't have a max height for the window (the html does have full height). I ha
Solution 1:
I managed to get a fix, this is quite a specific problem (which I've gather from the lack of response). But in-case anyone else stumbled across a problem like this.
All of my pages components had the following render:
exportdefaultclassAboutextendsReact.Component {
render() {
return (
<divclassName="content-wrapper">
{/* All my about code goes in here */}
</div>
)
}
}
I ended up removing the content-wrapper
classNames from all the page container dividers and did the following to the Layout
page:
exportdefaultclassLayoutextendsReact.Component {
render() {
const { location } = this.propsreturn (
<divclassName="wrapper"><DevTool /> {/* Remove for PRODUCTION */}
<Header /><Sidebar /><divclassName="content-wrapper">
{this.props.children}
</div><Footer /><Control /><divclassName="control-sidebar-bg"></div></div>
)
}
}
This solved all my problems :)
Post a Comment for "React Changing Route Breaks Height With Layout"