Как отделить гибкий элемент от другого гибкого элемента? - PullRequest
1 голос
/ 07 мая 2020

.innerContainer-1 {
  display: flex;
  margin: 10px;
}

.peoples,
.posts {
  list-style: none;
}

.peoples a,
.posts a {
  text-decoration: none;
  color: black;
}

.left-side,
.right-side,
.main-container {
  background: #ffff;
  border-radius: 10px;
}

.inner-side,
.news {
  padding: 20px;
}

.left-side {
  display: flex;
  flex-direction: column;
}

.main-container {
  flex: 2;
}
<div class="innerContainer-1">
  <aside class="left-side">

    <div class="inner-side">
      <h2>Popular Posts By.</h2>
      <div class="border2"></div>
      <ul class="peoples">
        <li><a href="">Himanshu</a></li>
        <li><a href="">John doe</a></li>
        <li><a href="">Anjela yu</a></li>
        <li><a href="">Brad treversy</a></li>
        <li><a href="">Peter mac</a></li>
      </ul>
    </div>

    <div class="news">
      <h2>Latest Post</h2>
      <div class="border2"></div>
      <ul class="posts">
        <li><a href="">Coronavirus</a></li>
        <li><a href="">India Lockdown 3.0</a></li>
        <li><a href="">WHO latest Post</a></li>
        <li><a href="">Work From Home</a></li>
        <li><a href="">Word's Economy</a></li>
        <li><a href="">Education</a></li>
      </ul>
    </div>
    <div class="main-container">
      <p> adipisicing elit. Harum, corrupti dolorem sed neque n.</p>
    </div>

то, что я хочу, - это всякий раз, когда я увеличиваю высоту бокового или основного контейнера, это не влияет на высоту других контейнеров, поэтому всякий раз, когда я увеличиваю содержимое в любом контейнере, относительный контейнер не будет высотой

...