Media Queries

Bonjour ,

J'aurais besoin d'aide , je mets en place mes Media Queries et je n'arrive pas à adpter la largeur de mon contenue , voici ou il y a une soucis.

Objectif : Que le contenue se disposer sur toute la largeur de l'écran :

#bloc_page

{

width: auto;

}

N'est pas prit en compte , il doit y avoir un erreurs dans le code CSS que je n'arrive pas à voir . Dans le code HTML Bloc-page contient l'intégralité de mon site hormis le header et le footer .



Voici mon code CSS

@media all and (max-width: 1024px)

{

section

{

flex-direction: column;

}

aside p

{

text-align: center;

}

#bloc_page

{

width: auto;

}

}

body

{

background:#F2F2F2;

font-family: verdana, serif;

color:black ;

padding:0;

margin:0;

}

#bloc_page

{

width: 60%;

margin: auto;

}

header

{

display: flex;

justify-content: space-around;

height:90%;

background: linear-gradient(#616166 62%, #333333 85%,#666666 100%); /* Standard syntax (must be last) */

}

#titre{width : 60% ;

display: flex ;

justify-content: space-between;

}

nav{

display:flex;

align-items:flex-end;

padding-bottom:1%;

}

#titre_principal

{

display: flex;

padding-bottom:1%;

align-items: flex-end;

}

/* les a href */

#menu-demo2 a{

text-decoration:none;

display:flex;

padding:8px 8px;

color:#fff;

font-family:verdana;

font-size : large;

}

section

{

display: flex;

margin-bottom: 20px;

}

article, aside

{

padding-top: 1%;

text-align: justify;

}

article p

{

font-size: medium;

font-family:verdana ;

aside

{

background:linear-gradient(#616166 82%, #333333 92%,#666666 100%); /* Standard syntax (must be last) */

border-radius: 5px;

padding: 1%;

color: white;

font-size:medium;

height:20%;

}