首页 > 解决方案 > 无法让 div 与 css 正确对齐

问题描述

我的设置是这样的:

.cprp_data {
  width: 100%;
  overflow: hidden;
}

.cprp_title {
  width: 80%;
  float: left;
}

.gelijkeniscore {
  float: right;
}

.cprp_percentage {
  float: right;
}

.cprp_excerpt {
  width: 80%;
  float: left;
}

.cprp-custom-container {
  float: right;
}
<div class="cprp_data">
  <div class="cprp_title">TITLE</div>
  <div class="gelijkeniscore">SOME CONTENT</div>
  <div class="cprp_percentage">SOME CONTENT</div>
  <div class="cprp_excerpt">SOME CONTENT</div>
  <div class="cprp-custom-container">SOME CONTENT IN SEVERAL DIVS
  </div>
</div>

cprp_data 应该充当包装器,这就是我希望其中的其他 div 对齐的方式:

<cprp_title> <gelijkeniscore>
<cprp_excerpt> <cprp_percentage>
               <cprp-custom-container>

需要明确的是,div cprp_excerpt 和 cprp_title 应该使用 80% 的宽度彼此左对齐,而其他 3 个 div 也应该使用剩余的 20% 右对齐,看起来有点像侧边栏.

我无法让它工作。使用几个 CSS 设置尝试了几个小时。上面的 CSS 与我到目前为止所获得的一样接近。但不知何故,cprp_excerpt div 一直占据 100% 的宽度,将 cprp-custom-container 向下推。任何帮助将非常感激!

标签: htmlcssalignment

解决方案


在 cprp_excerpt div 之后移动 cprp_percentage div


推荐阅读