我正在处理的页面位于http://www.derekbeck.com/1775/excerpts/
在桌面浏览器中看起来一切正常，但在移动屏幕截图中，如下所示，它被强制换行。（有关我的问题，请参见下图...）
我试图让它优雅地包装，但我有两个问题：
1) 是否有一些 CSS 方法来控制 div inline-block (class="exnote2") 的Want the entire chapter?<BR>Sign up for the newsletter!包装方式？
具体来说，我想要：
1a）padding-left: 20px;如果它在下面的第二行上，则它的左侧不存在（但如果它确实都在一行上，则有必要将其与PDF图标保持20px），
1b) div inline-block (class="exnote2") 上方的一些空格，使其与“Read Online”图标不那么接近。但是，如果我添加 padding-top 或 margin-top，它会影响桌面版本的漂亮布局（上面链接）。
对于上面的 1b)，我确实为图像后面的整个内联块、包含文本 (class="exitemdetails") 的整个 div 内联块一起制定了一个解决方案。我是这样做的：
.exitemdetails {
margin-left: 25px;
/* The following allows for graceful wrapping for mobile phones */
padding-top: 20px;
position: relative;
top: -10px; /* half the padding-top */
}
我也可以为这条线路设计一些东西Want the entire chapter?<BR>Sign up for the newsletter!，但我怀疑在不同的条件下它不会像我希望的那样显示。因此，我在这里发帖希望有一个更好、更优雅的解决方案，即如何使用 CSS 来控制 div 的换行方式，以及只有当它们换行时它们之间的间距。
2）我还有一个与此相关的问题：当空间不足时，是否没有简单的 CSS 方法来缩小书籍封面图像？我试过这个，但它什么也没做：
.eximage {
width: auto;
height: auto;
}
.eximage img {
max-width: 100%;
height: auto;
}
感谢您的关注！德里克