Fatal编程技术网
  • css/
  • 左右两侧的高度不均匀-CSS

左右两侧的高度不均匀-CSS

css

左右两侧的高度不均匀-CSS,css,height,Css,Height,在下面的代码中，我试图使左侧和右侧的高度相同，尽管我在左侧有很多信息，在右侧有一点信息。我希望在右边的文本下面有空白。我是不是编码错了，还是遗漏了什么？谢谢 #sides { padding-bottom: 40px; margin-bottom; 40px; background-color: white; } #leftside { width: 62%; display: inline-table; background-color: #000000; flo

在下面的代码中，我试图使左侧和右侧的高度相同，尽管我在左侧有很多信息，在右侧有一点信息。我希望在右边的文本下面有空白。我是不是编码错了，还是遗漏了什么？谢谢

#sides {
  padding-bottom: 40px;
  margin-bottom; 40px;
  background-color: white;
}

#leftside {
  width: 62%;
  display: inline-table;
  background-color: #000000;
  float: left;
  padding-right: 20px;
  padding-left: 5%;
  box-sizing: border-box;
}

#rightside {
  width: 38%;
  display: flex;
  background-color: #808080;
  float: left;
  padding-left: 20px;
  box-sizing: border-box;
  flex-direction: column;
}  

<div id="sides">
  <div id="leftside">
    <h1>TONS O' TEXT</h1>
  </div>
  <div id="rightside">
    <h1>TINY AMOUNT OF TEXT</h1>
  </div>
</div>

#侧面{
填充底部：40px；
边缘底部；40px；
背景色：白色；
}
#左边{
宽度：62%；
显示：内联表；
背景色：#000000；
浮动：左；
右边填充：20px；
左：5%；
框大小：边框框；
}
#右侧{
宽度：38%；
显示器：flex；
背景色：#808080；
浮动：左；
左侧填充：20px；
框大小：边框框；
弯曲方向：立柱；
}  
吨文本
少量文本
删除
显示：内联表从
#leftside
浮动块级元素的
显示
的计算值为
块
。因此
显示：内联表或
显示：flex在这种情况下无效。