空白のみのテキストノードを消したい

実現したいこと
日付（2020年7月15日）の下に”空白のみのテキストノード”が出来てしまい、レイアウトが上手く行きません。”空白のみのテキストノード”で出来てしまった空白を消したいのですが、消せずに困っています。

ここに質問の内容を詳しく書いてください。
HTMLとCSSを使って、ホームページ作成の練習をしていたのですが、上手くいきません。FireFoxのブラウザでレイアウトを見ながら進めているのですが、日付（2020年07月15日）の下に”空白のみのテキストノード”が出来てしまい、消したいのに消せずにいます。どのようにすれば、この空白は消すことができますか？

該当のソースコード

（ｈｔｍｌのコード）
↓　↓　↓　↓　↓　↓

<!DOCTYPE html> <html lang="ja"> <head> <mate charset="utf-8"> <title>フルーツデザートを求めて街歩き - FITTED </title> <meta name="viewport" content="width=device-width"> <link rel="stylesheet" href="style.css"> </head> <body> <header> FITTED </header> <div> <article> <h1>フルーツデザートを求めて街歩き</h1> <time datetime="2020-07-25"> 2020年7月15日　　　　　　　　　　 </time> 　<figure> <img src="img/fruits.jpg" alt"さまざまな果物が盛り付けられたフルーツプレート"> </figure> <p>街歩きをしているとお腹がすきます。そんなときにおすすめなのがフルーツデザートです。</p> <p>果物は手軽に食べることができます。熱中症予防や疲労回復などの効果もあるので、街歩きのエネルギー補給にぴったりです。</p> <p>最近はふらっと立ち寄れるフルーツ専門店も増えてきました。珍しい南国フルーツのプレートや、その場で作ってくれるフレッシュジュースも美味しくて、病みつきになります。</p> </article> </div> <footer> ©　FITTED </footer>

（ｃｓｓのコード）
↓　↓　↓　↓　↓　↓
charset "UTF-8";

/* ページ全体の設定　*/
body {
margin: 0;
font-family: sans-serif;
font-family: sans-serif;
}

/*　ヘッダーブロック*/
header{
padding: 25px 15px;
}
/*　コンテンツブロック　*/
div{
background-color: #29abe2;
padding: 40px 15px;
}

/*　記事　*/
article{
background-color: #ffffff;
padding: 20px;
}
h1{
font-size: 30px;
}
p{
line-height: 2;
}