Css media

Bonjour, voici mon code css pour une div :

#apDiv1 {
	position: relative;
	left: 300px;
	top: 28px;
	width: 52px;
	height: 19px;
	z-index: 1;
}
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 700px) {
	.apDiv1 {
		position: relative;
		width: 52px;
		height: 19px;
		z-index: 1;
		left: 200px;
		}
}

code html

<div id="apDiv1" class="apDiv1"

Le problème est lorsque je regarde sur mon iphone, l'"apDiv1" est toujours en position left a 300 px et non a 200px. pk?

merci par avance.

Sopra