CSSで画像の下に文字が回り込まないようにしたい

Question

画像の下に文字が回り込んでしまっているのですが、修正ができずに困っています。
はてなブログのパーツを使っているため、HTMLは基本的に変更はしたくありません。
CSSでどのように修正をしたらよいか、教えていただけないでしょうか。

以下、該当箇所の情報
・該当箇所のみのHTML

<div class="freezed">
<div class="hatena-asin-detail"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/B01BKCVET2/huwayu795-22/"><img class="hatena-asin-detail-image" title="マックス MAX 携帯用ホッチキス カラーギミック 10枚とじ ライトグリーン HD-10XS/LG" src="https://images-fe.ssl-images-amazon.com/images/I/41IumKcuX8L._SL160_.jpg" alt="マックス MAX 携帯用ホッチキス カラーギミック 10枚とじ ライトグリーン HD-10XS/LG" /></a>
<div class="hatena-asin-detail-info">
<p class="hatena-asin-detail-title"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/B01BKCVET2/huwayu795-22/">マックス MAX 携帯用ホッチキス カラーギミック 10枚とじ ライトグリーン HD-10XS/LG</a></p>
<ul>
<li><span class="hatena-asin-detail-label">出版社/メーカー:</span> マックス(MAX)</li>
<li><span class="hatena-asin-detail-label">メディア:</span> オフィス用品</li>
<li><a href="http://d.hatena.ne.jp/asin/B01BKCVET2/huwayu795-22" target="_blank">この商品を含むブログを見る</a></li>
</ul>
</div>
</div>
</div>

・ページ情報
https://nextcfo.hatenablog.com/entry/20180929/1538203058

Comments

[kei344]

CSSも提示されてはいかがでしょう。

[Null795]

CSSはどの記述は、どの記述がどこまで影響しているのかがわからないため、申し訳ないですが元ページより検証していただけないでしょうか。。。

Answer 1

以下の追加でいけそうな気がします。

.hatena-asin-detail-info ul {
  overflow:hidden;
}
.entry-content .hatena-asin-detail li {
  margin-left: 0px;
}

Comments

[Null795]

こちらの記述でうまく表示できました！
ありがとうございました！

Answer 2

きちんと確認はしていませんが。

.hatena-asin-detail{
  display:flex;
}