Bonjour à tous,

Je vais tenter de vous expliquer le plus clairement possible mon problème ;-)

Mon bg_header.jpg se veut "responsive", sa taille est de 1600x400px. Donc pour un internaute ayant une résolution proche de 1600px de large, je souhaite que ma balise header obtienne la hauteur de 400px... et si un internaute possède une résolution de 1200px de large, je veux que mon header fasse une hauteur de 300px... :)

Voici un code html simplifié.

<html>
    <head>
        <style type="text/css">
            header
            {
                background-image: url('bg_header.jpg');
            }
        </style>
    </head>
    <body>
        <header>
            <nav>
                <!-- mon menu -->
            </nav>
        </header>
    </body>
</html>

Si quelqu'un a une idée pour régler mon problème en HTML / CSS ? ... J'ai bien une solution, mais en javascript :)

Merci d'avance pour vos lumières :)

Y0ann

2 réponses


Y0ann
Auteur

Merci pour votre réactivité ;)