Problème de responsive design

Thomsath
Les bases HTML/CSS

Bonjour,

Je finalise la création de mon blog mais je me suis rendu compte d'un problème. En effet, lorsque je rétréci une page manuellement avec la souris, le repsonsive design répond parfaitement, mais par pour tout. En effet, dans mon menu j'ai mit un logo et une vidéo intégrée, et je leur demande à telle taille d'écran de se rétrécir.

Or, lorsque je rétréci l'écran avec la souris, ce logo ne se rétrécit pas. Je regarde alors les propriétés CSS dans la console, et je vois bien la taille que je souhaiterai avoir pour ce logo à cette taille d'écran (par exemple 400px en 1920x1080), mais en réalité celui-ci ne mesure pas la taille indiquée par la console (voir screen).

Cependant, une fois la page rafraîchie, le style s'actualise et vient à la taille souhaitée. Code de mes media queries :

@media all and (max-width:3000px) and (min-width:1700px) {

http://www.hostingpics.net/viewer.php?id=481003bug145.png (lien de la photo que je n'arrive pas à héberger ici)
En vous remerciant

4 réponses

SLK

Salut,

la "media query" que tu nous as montré :

@media all and (max-width:3000px) and (min-width:1700px) {

...et celle qui se trouve sur le screenshot, dans l'encadré rouge "taille demandé", ne correspondent pas.

Est-ce qu'il y a eu une erreur d'inatention ?

Sinon,
essaie quand même de nous montrer les codes HTML et CSS qui correspondent aux "menu" et "logo" du screenshot.

Thomsath
Auteur

Le bout de code donné est un exemple. Pour chaque taille d'écran (de xxx pixels à xxx pixels) je change la largeur de ces éléments grâce à un width.
On vois bien que le width fonctionne (du moins je résonne comme ça), car dans la console c'est la taille demandée, voulue, mais pas à l'affichage. Intégration du logo dans un tableau :

    <tr>
        <td id="logo"><a href="<?php bloginfo('url') ?>/"><img src="<?php bloginfo('url') ?>/pictures/logo.png" id="logo_img"></a></td>
    </tr>

Et donc la modification se fait comme ceci dans un media query :

#logo{
    width: 500px;
}
Semeen

Salut. Essaies avec un max-width

IvetteK31

Ouai max-width sa devrait passer