aタグで囲んだdivをhoverしたとき、div内の一部だけにunderlineを付けたい

Question

お世話になります。

ブログ記事の扉ページについて困りごとです。

各記事をこのような形で縦並びにしており、記事ひとつひとつをhoverしたとき、タイトル(「テストです。」部分)にのみ下線がつくようにしたいです。

調べたのですがわからなかったので、わかる方教えていただけませんでしょうか。
よろしくお願いいたします。

    <a href="#" class="post-item">
            <div class="post-thumb">
                    <img src="/img/sample.img" />
            </div>
            <div class="post__text">
                    <h2 class="post-title">テストです。</h2>
		    <p class="post-description">あなたは今そんなにその注意界というのの以上を売ったで。どうも昔が邁進通りもひょろひょろその啓発だですなりに伴って得るたには演説威張っませませて、少しにはありまし</p>
    	            <div class="post-date">2018年08月16日</div>
            </div>
    </a>

Answer 1

.post-item:hover .post-title {
  text-decoration: underline;
}

Comments

[Mmarie]

めちゃくちゃあっさり解決しました…！笑
難しく考えすぎていたみたいです。ありがとうございました！！