英文:
make the div stay at he top when scrolled
问题
我需要使这个div
在我向下滚动查看更多内容时保持在顶部。我尝试在div
中应用style={{position: sticky}}
,但似乎没有得到我期望的输出。还可以做什么?
英文:
I have a div element
<div className={ "flexRow alignItemsCenter margBot10 justifyContentSpaceBetween margTop24" } >
<h2 className="dialog__title subheading-text-medium fontMedium">Galley No:&nbsp;&nbsp;{airCraftLoadingSel.galley}</h2>
</div>
i need to make this div stay at the top when i scroll down to see more content .i have tried applying style={{position:sticky}} in the div but doesn't seems to give me the desired output.what else could be done.
答案1
得分: 0
Here's the translated code snippet:
<div style={{ position: "fixed", top: 0, zIndex: 1, width: "100%" }} className={"flexRow alignItemsCenter margBot10 justifyContentSpaceBetween margTop24"}>
<h2 className="dialog__title subheading-text-medium fontMedium">Galley No: {airCraftLoadingSel.galley}</h2>
</div>
Please note that this code is written in ReactJS, and I have removed the extra curly braces around the style object, as well as the double quotes within it as requested.
英文:
If you want to make the div
element stay at the top of the page when scrolling, you can try setting the position
property to fixed and adjusting the top property to make sure it's positioned correctly. Here's code example
<div style={{position: "fixed", top: 0, zIndex: 1, width: "100%"}} className={ "flexRow alignItemsCenter margBot10 justifyContentSpaceBetween margTop24" } >
<h2 className="dialog__title subheading-text-medium fontMedium">Galley No:&nbsp;&nbsp;{airCraftLoadingSel.galley}</h2>
</div>
Write the code above it's reactjs if not you can write the style without the "" and at the end you should have ;, and it should have only the {} not two {{}}.
I hope this answers your question.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论