Problème d'affichage sur mobile

Bonjour , j'ai un soucis par rapport à l'affichage de mon site sur mobile en regardant plusieurs tuto j'ai vue qu'il y a 2 méthode je me suis rabattue sur cette méthode

<link rel="stylesheet" title="couleur" type="text/css" href="../style/projet.css"/ media="screen">

ensuite le meta

<meta name="viewport" content="width=device-width">

et ensuite dans mon projet.css en haut je rajoute le code css (une partie seulement)

@media  screen and  (max-width:1024px){
	body{
		width:100%;
	}
	.title{
		width:auto;
	}
	.contenu{
		width:auto;
	}
}

et quand je vais sur ma page depuis mon portable mon body prend bien 100% de la page mais le reste de mes div même avec des width auto ou 100% s'arrête environ à 70% de largeur de la page. En m'étant 130% certains augmente mais pas tous je comprend pu rien.

J'ai essayé en enlevant le meta le site s'affiche correctement mais du coup les info dans @media ne sont pu pris en compte. Je ne sais pu quoi faire je suis dessus depuis 4h et toujours l'impasse merci de m'aider.

Les media queries si je ne m'abuse se placent à la fin du code sinon la lecture par le navigateur commence par les media queries.