疑似要素で指定したコンテンツにiPhoneでのみ枠線がついてしまうので消去したい

Question

現在、WordPressにてWEBサイトを作成中です。

疑似要素を用いて、背景画像として画像を配置しておりますが、iPhoneで確認するとその部分に下記のような枠線が発生してしまいます。
この枠線を消す方法はありますでしょうか？

以下、画像の右上のテントの画像のCSSになります。

該当のソースコード

.event-wrapper::before {
	position: absolute;
	top: 0;
	right: 0;
	content: url();
	display: block;
	width: 30%;
	height: 210px;
	background: url(https://wasabishokudo.com/wp-content/uploads/2021/02/flag_right.png) no-repeat;
	background-size: 100%;
}

試したこと

• border: none; の追加
• filter: drop-shadow(0px 0px 0px #fff); の追加

（もちろんどちらもダメでした。）

補足情報

テーマはCocoonを使用しており、CSSで調整を加えています。

よろしくお願いいたします。

Answer 1

こんにちは。

こちらですよね？
https://wasabishokudo.com/

当方の環境で見たところ、content: url();→content: "";とすれば解消されました。
空のURLをコンテンツにするのを何か意図があってやっているのでなければ、お試しになってはいかがでしょうか。

Comments

[Hananz]

ご回答ありがとうございます！

content: url();でも画像が表示されていたのでそのままにしておりましたが、コードを直したら枠線が消えました。
勉強になります。改めまして、ありがとうございました！

[Lhankor_Mhy]

この現象は私も知りませんでした。
良質問ありがとうございます、勉強になりました。