Redimensionner la police d'écran de l'écran dans le bootstrap 4 ne fonctionne pas

Question

Lorsque j'essaie de définir la taille de la police et que la taille de l'écran passe à un téléphone mobile (320px) avec écran multimédia dans mon CSS personnalisé. La valeur est toujours la valeur sur non-media-screen mais ne fonctionne pas.

Mon CSS:

@media only screen and (min-width: 320px) { 
 
\t .card{ 
 

 
} 
 

 
.card .title{ 
 
\t color:black; 
 
\t border-bottom:1px solid #f5f5f5; 
 
\t margin-bottom:2px; 
 
} 
 

 
.card .title a{ 
 
font-weight: bold;font-size: 10px;color:#949393; 
 
\t 
 
} } 
 

 
.card .title a{ 
 

 
\t font-weight: bold; 
 
\t font-size: 14px; 
 
\t color:#949393; 
 
\t 
 
}

Answer 1

Le problème est que la déclaration du style normal est placé après la définition de la requête des médias. Bien que le style de requête multimédia soit appliqué, il est également remplacé par le style normal qui est placé plus bas dans la feuille de style.

Answer 2

Voici votre code fixe

@media only screen and (min-width: 320px) { 
    .card{ 

} 

.card .title{ 
    color:black; 
    border-bottom:1px solid #f5f5f5; 
    margin-bottom:2px; 
} 

.card .title a{ 
font-weight: bold; 
font-size: 10px; 
color:#949393; 
} 
}