英文:
How to make elements in grid to have their own specific height?
问题
这是以下的容器。<br/>
您已经注意到网格中最后一个元素（类似表格结构）看起来很奇怪。是的，它看起来很奇怪，因为它正在获取该行中存在的元素的最大高度。<br/>
我只是希望元素看起来像...<br/>
您能告诉我在我应用了grid的bodyContainer内部应该使用哪个CSS属性吗？<br/>
这是我应用的CSS。
.bodyContainer {
margin-top: 3rem;
padding: 0rem 2rem 0rem 2rem;
display: grid;
grid-template-columns: 25% 25% 25% 25%;
justify-content: space-between;
}
英文:
This is the following Container. <br/>
You have noticed that last element in the grid (Table like Structure) looks weird. YES, it looks weird because it is taking the maximum height of the element present in that row. <br/>
I just want the element to be look like...<br/>
Can you help me what CSS property should be used inside bodyContainer where I applied grid. <br/>
This is the CSS I have applied.
.bodyContainer{
margin-top: 3rem;
padding: 0rem 2rem 0rem 2rem;
display: grid;
grid-template-columns: 25% 25% 25% 25%;
justify-content: space-between;
}
答案1
得分: 1
你想添加align-items: start;样式。这将告诉每个子元素保持其自然高度。默认值是align-items: stretch;。
英文:
You want to add the align-items: start; style. That will tell each child to be its own natural height. The default is align-items: stretch;
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论