Problème bootstrap débutant d-none et d-*-block

-
Bonjour,

Je pose ma question ici en dernier espoir car, après avoir chercher pendant assez longtemps, je n'ai trouvé personne pour m'aider (bien que ça doit être simple, je ne suis qu'un débutant :/)

Je voulais faire disparaître mon titre lors du passage en médium et j'ai utilisé d-md-block et block-none.

Le problème c'est que l'effet recherché ne s'effectue qu'en sm et qu'en md, mon titre prend l'équivalent de 12 cases...

Voici mon code: (je ne trouve pas le html, que xhtml, déso)
<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
 <link rel="stylesheet" type="text/css" href="test1.css">
 <title>Test1</title>
</head>
<body>
 <div class="container-fluid no-padding">
   <div class="row entete no-padding">
          <div class="col-lg-2 d-none d-md-block"><img src="images/logo1.png" class="logo_entete" alt=""><strong>No Limit</strong></div>
          <div class="col-lg-6 hidden-sm-block"></div>
          <div class="col-lg-1 col-md-4 menu col-md-4">Accueil</div>
          <div class="col-lg-1 col-md-4 menu col-md-4">Profil</div>
          <div class="col-lg-1  col-md-4 menu col-md-4">Contact</div>
          <div class="col-lg-1 d-none d-md-block"></div>
        </div>
  <div>
   
  </div>
  
  <section class="section1">
   <div class="banniere row">
    <div class="col-lg-12 banniere_background">
     <video src="images/video_bg2.mp4" autoplay="autoplay" muted="muted" class="video_banniere" loop="loop"></video>
    </div>
   </div>
   <div class="title_banniere_div"><div class="title_banniere_div2"><h1 class="title_banniere">Browse.<br>Choose.<br>Customize.</h1></div></div>
   <div class="under_banniere"></div>
  </section>
  <section>
   <div>
    <div></div>
    <div></div>
    <div></div>
   </div>
  </section>
  <footer>
  
  </footer>
 </div>
</body>
</html>

et css:
/*color:
rgb(218, 220, 224) --> font
rgb(248, 249, 251) --> background
rgb(94, 98, 103) --> menu hover


*/

body
{
 margin: 0;
 padding-right:0;
 padding-left:0;
 color: rgb(179, 179, 179);
 background-color: rgb(248, 249, 251);
}

.no-padding > [class*='col-'] 
{
 padding-right:0;
 padding-left:0;
}

.entete
{
 border-bottom: 1px rgb(218, 220, 224) solid;
 box-shadow: 3px 0px 3px rgb(218, 220, 224);
 line-height: 50px;
 width: auto;
 padding: 0;
 margin: 0;
 margin: 0 -1.1%;
 background-color: white;
}

[class*="col-"]
{
 text-align: center;
 padding: 0;
}

.col-lg-offset-1
{
 margin-left: 8.33333333333%;
}

.col-lg-offset-5
{
 margin-left: 41.6666666667%;
}


.logo_entete
{
 max-width: 20%;
 margin-right: 3%;
}

.menu:hover
{
 color: rgb(94, 98, 103);
 cursor: pointer;
}

/*bannière*/

.banniere
{
 max-height: 300px;
 overflow: hidden;
}

.video_banniere
{
 width: 100%;
}

.section1
{
 position: relative;
}

.title_banniere_div
{
 position: absolute;
 transform: translateY(-50%);
 bottom: 0;
 width: 100%;
 display: flex;
 justify-content: center;
}

.title_banniere
{
 color: white;
 z-index: 1;
 margin: auto;
}

.under_banniere
{
 min-height: 20px;
 background-color: white;
 margin: 0 -1.1%;
 border-bottom: 1px rgb(218, 220, 224) solid;
 box-shadow: 3px 0px 3px rgb(218, 220, 224);
}

.d-none
{
 display: none;
}



EDIT : Ajout des BALISES DE CODE

Voilà, désolé d'avoir déranger et j'espère que vous pourrez m'aider. :(
Afficher la suite 

2 réponses

Messages postés
26769
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
14 novembre 2019
1880
0
Merci
Bonjour,
Je pense que tu dois utiliser :
d-none d-md-flex

Merci jordane pour ta réponse, mais il semble malheureusement que le problème persiste: le titre reste affiché en md mais est juste en mode flex...
Commenter la réponse de jordane45
Messages postés
156
Date d'inscription
dimanche 27 mars 2016
Statut
Membre
Dernière intervention
12 novembre 2019
23
0
Merci
Bonjour,

<div class="d-none d-lg-block">Cacher sur tous les écrans plus petits que lg</div>

Ou
<div class="d-md-none d-lg-block">Caché seulement sur md</div>

Mika023
Messages postés
1
Date d'inscription
dimanche 10 novembre 2019
Statut
Membre
Dernière intervention
10 novembre 2019
-
Merci beaucoup pour ta réponse Seb1, mais je pense avoir mal exprimer mon problème, maintenant que je me suis inscris en tant que membre, je peux te montrer via l'image ci-suit:

Mon titre, "No Limit" est censé disparaître une fois passé en médium... Il n'en est rien et c'est la raison pour laquelle je pose ma question :(
Merci de m'avoir aidé en tout cas et, si vous trouvez le problème, je serai heureux de lire la solution. :D
Commenter la réponse de 1Seb