我已经开始使用react-grid-gallery了,它看起来非常适合我所需要的东西。我对它唯一的问题是,我似乎不知道如何真正地将它居中。下面是它在屏幕上的显示方式:
我似乎不能调整画廊的边距,也不能使它居中。
class Testimonials extends React.Component {
render() {
return (
<div>
<h2>See what people are saying...</h2>
<body className="testimonial-body">
<p>"Dependable, trustworthy, and expert workmanship all
describe Kevin and his business.
He completely transformed our condo, painting it from top to
bottom, among other projects.
Not only does he do excellent work, but he's a
pleasure to have in your home. For any future projects,
there's no one we'd rather have than Kevin."
<span class="testimonial-signature"> - Doug and Sue ⋅ Brookfield, WI</span>
</p>
</body>
<center><Gallery images={doug_and_sue_images}/></center>
</div>
);
}
}
发布于 2018-12-11 08:30:03
<center>
已弃用-请使用css。以下是在视口中水平移动的标准方法:
Gallery { margin: 0 auto;}
有一件事我不太确定,那就是你使用的是一个元素--这应该是一个带有"gallery“类的div吗?
或者将其放在具有居中样式的div中
<div class="gallery-wrapper">
<Gallery images={doug_and_sue_images}/>
</div>
// css
.gallery-wrapper {
text-align: center;
}
.gallery-wrapper Gallery {
max-width: 80%; // or whatever you want
margin: 0 auto;
}
https://stackoverflow.com/questions/53715685
复制相似问题