css expand en fonction de la taille de l'écran du portrait ou du paysage?
J'ai deux divs qui flottent à côté les uns des autres. Ce que je voudrais, c'est avoir une largeur de 100px lorsque vous cherchez à elle en mode portrait et permet de dire que 200 px dans le paysage. Ce qui se passe l'affichage sur un appareil mobile, en fait.
Donc la div élargiront quand dans le paysage de la mode et rétrécir un peu dans le portrait.
Des idées?
source d'informationauteur Xtian
Vous devez vous connecter pour publier un commentaire.
Eh bien, ce n'est pas possible avec CSS2, mais il serait possible de faire ce que vous voulez avec Javascript (lire la taille de l'écran etc.).
Je ne suis pas sûr de ce que la technologie que vous cherchez dans les, mais CSS3 offre exactement ce que vous voulez avec CSS3 Media Queries.
Avec CSS3 vous avez du plaisir à des trucs de ce genre (ou vous pouvez même spécifier la largeur par exemple 200px):
Découvrez cette page d'exemple pour plus d'explication, ou cette une.
MODIFIER Juste parce que j'ai trouvé cette page aujourd'hui: Hardbroiled CSS3 Media Queries - très bon writeup.
Vous pouvez le faire en utilisant le css médias de la fonction "orientation". De cette façon, vous pouvez spécifier les styles en fonction de l'orientation de l'écran, indépendant de la taille de l'écran. Vous pouvez trouver l'officiel w3.org définition à propos de cette fonctionnalité de média ici. Combiné avec le cahier des charges sur developer.mozilla.org cela permettra d'expliquer comment il fonctionne.
Citation de w3.org à propos de l'orientation fonctionnalité de média:
Une note/citer developer.mozilla.org à propos de la "orientation":
Donc, pour résumer, il n'est pas effectivement l'orientation de l'écran qui déclenche portrait ou paysage des requêtes de média. Cependant c'est le ratio entre la hauteur et la largeur de l'écran! De ce fait, il est également judicieux d'utiliser la "fonction de l'orientation" avec les mobiles/tactiles périphériques donc j'ai ajouté une petite démo pour montrer le comportement de ces requêtes.
JSFIDDLE DÉMO (essayez de redimensionner la fenêtre d'affichage)
Voici le représentant des requêtes de média touchant l'orientation portrait et paysage.