如何设置 <div class="ui inverted secondary stackable menu"style="height: 40px;"> 在 <div class="ui container"> 里面居中
时间: 2023-07-06 22:05:40 浏览: 93
可以使用flex布局来实现。
首先,在`<div class="ui container">`里添加一个父元素,比如一个`<div>`标签,设置其样式为:
```
display: flex;
justify-content: center;
align-items: center;
```
然后,将`<div class="ui inverted secondary stackable menu"style="height: 40px;">`放入这个父元素里面,即可实现在`<div class="ui container">`里面居中。
完整代码示例:
```
<div style="display: flex; justify-content: center; align-items: center;">
<div class="ui inverted secondary stackable menu" style="height: 40px;"></div>
</div>
```
相关问题
<div class="ui inverted secondary stackable menu"> 如何设置这个div 小一点
可以尝试修改该div的样式,如下所示:
```html
<div class="ui inverted secondary stackable menu" style="height: 50px;">
...
</div>
```
你可以通过修改 `height` 的值来调整该div的高度,从而达到缩小的效果。
<div class="right item" style="margin-left: 40px;"> <div class="ui inverted container" style=" font-size: 16px;line-height: 50px;"> <p class="notification-content">woshi1</p> </div> </div>为什么这段代码不能让这个容器在右边,怎么才能让它在右边?
这个容器在左边的原因是因为你使用了 `margin-left: 40px;` 属性,这个属性会将容器向右移动一定的距离,所以它出现在了左边。
如果你想让这个容器出现在右边,需要使用 `float: right;` 属性来实现。修改代码如下:
```
<div class="right item" style="float: right;">
<div class="ui inverted container" style="font-size: 16px; line-height: 50px;">
<p class="notification-content">woshi1</p>
</div>
</div>
```
这样就可以让容器出现在右边了。注意,`float` 属性会将元素从文档流中移除,因此可能需要为父元素设置 `overflow: hidden;` 属性来防止布局崩溃。
阅读全文