Responsive problème design

Bonjour tout le monde,

J’aurais besoin d’aide avant que je transperce le mur de mon appart à force de me taper la tête contre.
Je fais mon premier test de « site » dans ce cas c’est mon CV en RWD et je bloque dès la première étape.

J’arrive à faire passer mon body d’une autre couleur mais mon wrap ou un autre élément ne veut rien savoir, j’ai tout essayé. Ma ma class « wrap » ou une autre ne veut pas changer de widht, est ce que j’ai fait quelque chose de faux ?
Merci pour votre aide.

voici le lien
**********************
Ne faites pas attention au style du cv c’est un test
Merci beaucoup
Modifié par Web (14 Dec 2013 - 23:08)

Bonjour.

Les medias queries ne changent pas la priorité des sélecteurs.

si tu écris:

@media screen and (max-width:920px) {
  .wrap {
    color: blue;
    width: 200px;
  }
}

.wrap {
  width: 800px;
}

cela sera équivalent à écrire (lorsque la media query s'applique) :

.wrap {
  color: blue;
  width: 200px;
}

.wrap {
  width: 800px;
}

Ce qui devrait te donner une réponse

Sinon, le RWD est basé sur des designs fluides.

Sinon le positionnement en relative de ton contenu n'est pas terrible: les textes en blanc devraient être dans le bandeau. => Initiation au positionnement en CSS (Partie 1)
Modifié par kustolovic (13 Dec 2013 - 16:51)

Ok merci pour ta réponse,

donc si je comprend bien je ne dois pas définir, par exemple, un background-color pour toute la page et le changer au fil des tailles d'écrans avec le medias query,
mais bien l’insérer uniquement dans les différents medias queries qui couvrirons toutes les tailles d’écrans ?

je sais pas si je suis claire mais je vais faire un test avec mon résonnement et ta réponse.



j'ai du manquer quelques chose lors de mon apprentissage sur le web sur les médias queries il faut que je révise tous ce que j'ai pu lire sur le rwd et là je vais vraiment transpercer le mure avec ma tête et pouvoir dire bonjour à mon voisin.

Merci

Salut,

Web a écrit :
donc si je comprend bien je ne dois pas définir, par exemple, un background-color pour toute la page et le changer au fil des tailles d'écrans avec le medias query,
mais bien l’insérer uniquement dans les différents medias queries qui couvrirons toutes les tailles d’écrans ?

En fait, il vaut mieux insérer d'abord les règles et déclarations CSS applicables par défaut, puis spécifier selon telle ou telle media query. Autrement dit :

.wrap {
  width: 800px;
}
@media screen and (max-width:920px) {
  .wrap {
    color: blue;
    width: 200px;
  }
}

Ok merci pour ton aide encore,

donc en faite mon problème était simplement un problème de placements du média querie qui devrait se placer toujours après la valeur par défaut et jamais avant ?

Donc les medias queries se placent en bas du code css ?

Merci