CSS の flexbox を display: none; で非表示にできますか？

ウェブサイトを手打ちで作成しています。

フレックスボックス（flexbox）を、パソコンのブラウザで非表示いしたいと考えています。

CSS でメディアクエリーを用いて、その中で display :none; を記述したのですが、非表示になってくれません。

CSS の flexbox を display: none; で非表示にできますか？ 教えてください。お願いします。

質問者からの補足コメント

• bx2さん、ご回答ありがとうございます。
  
  今回、HTMLとCSSは次のように記述しました。こちらを、スクリーンのサイズによって（幅599ピクセル以下は、スマホの設定で表示）、自動的に切り替えたいです。
  
  CSSにメディアクエリー（例えば、@media screen and (max-width: 599px)）を設定すると、確かに、スクリーンサイズによってフレックスボックスは表示・非表示になるのですが、HTMLの要素「メニュー１　メニュー２　メニュー３」がテキストとして表示されてしまうのです。
  
  display:none; の記述にこだわらず、メディアクエリーで、フレックスボックスを、その中の要素（テキストや画像）も含めて非表示にする方法があれば教えてください。

    補足日時：2021/03/06 13:06

• ■HTML
  <!-- パソコン表示用メニュー -->
  <div class="f-container_top_pc">
  <div class="f-item_top_pc">メニュー１</div>
  <div class="f-item_top_pc">メニュー２</div>
  <div class="f-item_top_pc">メニュー３</div>
  </div>
  
  <!-- スマホ表示用メニュー -->
  <div class="f-container_top_phone">
  <div class="f-item_top_phone">メニュー１</div>
  <div class="f-item_top_phone">メニュー２</div>
  <div class="f-item_top_phone">メニュー３</div>
  </div>

    補足日時：2021/03/06 13:06

• ■CSS
  .f-container_top_pc{ /* PC用トップページのフレックスボックス */
  display:flex;
  
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content:space-around;
  align-items:stretch;
  
  background-color: #ccc;
  
  padding: 12px;
  }
  
  .f-item_top_pc{
  text-align: center;
  
  width: calc(33.3% - 10px);
  border-radius:5px;
  color:#fff;
  font-weight: bold;
  background-color:#55c3dc;
  
  padding: 24px;
  }

    補足日時：2021/03/06 13:07

• .f-container_top_phone{ /* スマホ用トップページのフレックスボックス */
  display:flex;
  
  flex-direction: column;
  justify-content:space-around;
  align-items:stretch;
  
  background-color: #ccc;
  
  padding: 12px;
  }
  
  .f-item_top_phone{
  text-align: center;
  
  font-size: 1.5em;
  border-radius:5px;
  color:#fff;
  font-weight: bold;
  background-color:#55c3dc;
  
  padding: 24px;
  }

    補足日時：2021/03/06 13:07

No.1 ベストアンサー 回答者： bx2 回答日時： 2021/03/05 18:20

下記でどうですか？

display: none !important;

この回答へのお礼

bx2さん、早速のご回答ありがとうございます。

私の理解が足らず、質問の仕方が良くなかったようです。改めて「補足」させていただきます。ごらんください。

お礼日時：2021/03/06 13:05