target疑似クラスが効かない

初めまして。
bootstrap4でコーディング中です。
別ページのアンカーリンクから、display:noneに設定されているboxを
display:blockにする方法を調べ、target疑似クラスを知りそちらを設定しました。
ただ、今のところMicrosoft Edgeのみでしか動かないので、どこがおかしいのか教えていただけると助かります。
jsを使用したアコーディオンだと別ページのアンカーリンク先がずれるので、
cssのみで組み立て直して切り替えを行うようにしました。

前提・実現したいこと

Microsoft Edge以外でも動くようになってほしい。

8/24追記：
IE11でも動いていました。
こちらのHTML/CSSのみだと動くようですので、
bodyの中身を貼り付けます。

該当のソースコード

アンカーリンク先

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4  <meta charset="utf-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1">
6
7  <title>メニュー一覧</title>
8  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
9  <link rel="stylesheet" href="css/style.css" >
10
11
12</head>
13
14<body id="MENU">
15
16<div id="header"></div>
17<div class="add-control">
18  <div class="action-allopen">
19    <input type="checkbox" class="checkbox" id="allopen3" name="allopen3" /><label for="allopen3" class="btn"><h2><img src="img/xxx.jpg" class="img-fluid"></h2></label>
20    <div class="box" id="menu">
21	    <p>内容</p>
22	    
23    </div>
24  </div>
25</div>
26<div id="footer"></div>
27<p id="page-top"><a href="#wrap">PAGE TOP</a></p>
28	<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
29	<script>
30	$(function() {
31	      $("#header").load("header.html");
32	    });
33	$(function() {
34	      $("#footer").load("footer.html");
35	    });
36	</script>
37	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
38	<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
39	<script src="js/pagetop.js"></script>
40
41</body>
42

css
1
2.add-control .action-allopen .box {
3    display: none;
4}
5
6.add-control .action-allopen .box:target {
7  display: block;
8}

別ページのアンカーリンク（アンカーリンク先とbodyの中身は一緒です）

html
1<div class="col-6 col-lg-4 pr-1 pr-md-0">
2          <h2><a href="menu.html#menu"><img src="xxx.jpg" class="img-fluid mx-auto d-block"></a></h2>
3</div>