- 此问题在此处已有答案**:
How can I center text (horizontally and vertically) inside a div block?(27个答案)
How can I vertically center a div element for all browsers using CSS?(48个答案)
昨天关门了。
我试着把我的文本放在我的div的中间,但是我没有找到一个很好的解决方案和干净。与填充的div增长,这不是我想要的。我可以创建一个div框,但它有点棘手,当代码复杂的增长,这可能会增加问题。所以如果有一个简单的解决方案,我想知道它,像TextAlign : "center"
,但垂直,而不仅仅是水平。
import "./styles.css";
export default function App() {
const style = {
border: "1px solid black",
// padding: "50px 0 0 0", // padding is not good
// textAlign : "center"; // but for the vertical that's possible ?
width: "100px",
height: "100px"
};
return (
<div className="App">
<div style={style}>milieu</div>
</div>
);
}
我在代码沙盒上的尝试:https://codesandbox.io/s/brave-ellis-d9ju09?file=/src/App.js:0-366
预期结果:
1条答案
按热度按时间xtfmy6hx1#
你可以使用flexbox来垂直和水平居中对齐一个元素。
你可以使用这个工具来学习flexbox -https://flexboxfroggy.com/