How to arrange divs one over another?

Question

How can I arrange divs one over another?
I've tried float, clear, all positions but it doesn't work.

img {
  float: left;
  padding-right: 15px;
}

1 {
  position: absolute;
  clear: left;
}

2 {
  position: absolute;
}

<div id="1">
  <img src="//via.placeholder.com/300x300" alt="imagine" width=300 height=300 />
  <p>Mos Goriot - Honore de Balzac<br> 10 lei</p><br>
</div>

<div id="1">
  <p><img src="//via.placeholder.com/220x300" alt="imagine" width=220 height=300 /> Peter Camenzind - Herman Hesse<br>15 lei</p>
</div>

Here's a screenshot of how it currently looks:

Answer 1

您的代码存在一些问题：

1. IDs must be unique

2. 要在CSS中引用ID，请从#开始。

     

   #id_value {style properties}

   见CSS ID Selectors @ MDN。

下面，我使用＆＃34; clearfix＆＃34;方法。有关更多参考，请参阅：
What is a clearfix?
What methods of clearfix can I use?
Chris Coyier on Clearfix

＆＃13;
＆＃13;
.group:after {
  content: "";
  display: table;
  clear: both;
}

.entry {
  margin: 0 0 1em;
}

img {
  float: left;
  margin-right: 15px;
}
＆＃13;
<div class="entry group">
  <img src="//via.placeholder.com/300x300" alt="imagine" width=300 height=300 />
  <p>Mos Goriot - Honore de Balzac<br> 10 lei</p>
</div>

<div class="entry group">
  <img src="//via.placeholder.com/220x300" alt="imagine" width=220 height=300 />
  <p>Peter Camenzind - Herman Hesse<br>15 lei</p>
</div>
＆＃13;
＆＃13;
＆＃13;