Bootstrap carrousel ajuster la hauteur

Je suis nouveau dans le Bootstrap et j'ai une question à propos de carousel. J'ai besoin de régler une hauteur de 700 pixels sur les écrans (pc) et d'une hauteur de 500 px pour les téléphones cellulaires. Comment puis-je le faire? J'ai mis ceci:

 @media (min-width: 320px){
    .carousel-caption p {
    margin-bottom: 20px;
    font-size: 20px;
    line-height: 1.4;
    }
    .carousel {
    height: 500px;
    margin-bottom: 60px;
    }

    .carousel .item {
    height: 500px;
    background-color: #777;
    }
    .carousel-inner > .item > img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 500px;
    }

}

J'attends une réponse.

Merci!

InformationsquelleAutor Microsource | 2013-12-06
  1. 0

    Je ne peux pas le tester droit de savoir, mais si vous voulez avoir les 500 px de hauteur dans le cas d'appareils avec une largeur inférieure à 320px vous êtes à la requête de média doit être @media (max-height:320px) au lieu de @media (min-width:320px).

    EDIT:

    Je l'ai testé et cela fonctionne:

    @media (max-width:320px){
  .carousel{
     height:50px;
   }
}

    De cette façon à partir des résolutions qui ont une largeur de 0 à 320, la .carousel classe aura 50px de hauteur.

    Si ce résoudre votre problème s'il vous plaît n'oubliez pas de voter et de choisir cette réponse 🙂

    • Merci pour la réponse! J'avais testé mais je pense que je me trompe car je ne sais pas comment dois-je utiliser le media querie. Par exemple, j'utilise " @media (max-height:320px){...code 1...} @media (min-height:760px){...code 2,...} et d'un media querie j'ai mis le code 1 avec d'autres valeurs de hauteur (ce qui est compréhensible?) Si vous n'avez pas à me comprendre, j'essaie d'être plus claire!
    • Je ne sais pas si je vous comprends mais je pense que j'ai fait une erreur de trop. C'est max-width:320px (la largeur de la résolution) et quand vous avez que la largeur ou moins, vous voulez le carrousel d'avoir height:500px . Essayer de cette façon, s'il vous plaît. Si cela ne fonctionne pas, essayez d'utiliser le max-height:500px;
    • Voir mon edit s'il vous plaît !
    • Désolé pour le retard!! - Je résoudre ce à l'aide d'une autre solution (je ajuster la hauteur à 100% et ce qui fonctionne le mieux!). De toute façon, je prouver votre conseil, mais n'a pas fonctionné...
    • Merci pour votre temps!
    InformationsquelleAutor luidgi27