javascript - 如何使两个不同的组件具有相同的高度

标签 javascript css reactjs

我有一张 react 卡,它可以根据某个 Prop 是否处于事件状态来渲染两种不同的东西。我怎样才能确保两个不同的东西高度相同,因为当我将它们并排放置时,卡片的尺寸不一样?

代码如下:
<div className={cardInfoClasses}> <h3 className={titleClasses}>{this.props.name}</h3> {cardMain} </div>

cardMain 可以是:
<div> <Progress productData={productData} className='mobile_hide'/> </div>;或者
<CardButton initialData = {this.props.data}/>

最佳答案

您可以使用 display flex 或 table 来实现。您赋予父级显示 flex 并调整其他属性,例如 justify-elements 和 width。

关于javascript - 如何使两个不同的组件具有相同的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44770515/

相关文章:

html - 如何让文字出现在图片之上

javascript - React、JavaScript 中捕获 504(网关超时)错误

javascript - 无法以编程方式更改 react 路由器中的路线

javascript - 打开或关闭分组

javascript - 如何在 Sencha touch 2.1 中创建复杂的数据项?

javascript - 如何从订阅数组中取消订阅

javascript - 使用 javascript 设置 CSS @Media min-width 值

javascript - React Native嵌套导航实现登录/注册后带有选项卡的登陆屏幕(bottomTabNavigator)(StackNavigator)

html - 将 float 导航元素保持在一行

css - 调试 React CSS 过渡