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

A voir également:Problème bootstrap débutant d-none et d-*-block[CSS] display: {block|none}; TABLE sous IE??? ✓ - Forum - CSS Comment exécuter un code avec Code::Blocks (programme simple de débutant) ✓ - Forum - C Code blocks - Télécharger - C/C++ Ad block safari - Télécharger - Extensions Ad block firefox - Télécharger - Extensions

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. :(

Forum

A voir également:Problème bootstrap débutant d-none et d-*-block[CSS] display: {block|none}; TABLE sous IE??? ✓ - Forum - CSS Comment exécuter un code avec Code::Blocks (programme simple de débutant) ✓ - Forum - C Code blocks - Télécharger - C/C++ Ad block safari - Télécharger - Extensions Ad block firefox - Télécharger - Extensions

Web: www.shapebootstrap.net

2 réponses

Marsh

NOVEMBER 9, 2013 AT 9:15 PM

Bonjour,
Je pense que tu dois utiliser :

 d-none d-md-flex 

Reply
réponses:
  • auteur

Marsh

NOVEMBER 9, 2013 AT 9:15 PM

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>

Reply
réponses:
  • auteur

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed