Arkadaşlar selam, yaklaşık 4 saattir uğraşıyorum işin içinden çıkamadım, elimde bir kod var, 4 tane fotoğrafı div yaptım yan yana ve alt alta dizdim, pc deyken problem yok fakat mobilden girdiğimde fotoğraflar yana doğru kayıyor. mobilde width ayarını bir türlü yapamadım oto. küçülmesini istiyorum, kodları paylaşıyorum eksiğim nerde yardımcı olursanız çok sevinirim.

<div class="anasayfa">
<style type="text/css">



div.bgd {
	max-width: 100%;
  float:left;
  width:100%;
  height:auto;
  min-height:300px;
  border:0px solid #e1e1e1;
  clear:both;
  

}
div.items-1 {
  clear:both;
  float:left;



  
}
div.items-2 {
	clear:right;
  float:right;

  
}
div.items-3{
	clear:both;
  float:left;
    position: absolute;

  
}

div.items-4{
	clear:both;
  float:right;

  
}

div.items-1, div.items-2, div.items-3, div.items-4 {
  width:31%;
  height:auto;
  min-height:300px;
  margin:1%
}

@media screen and (max-width:479px){
  

	
  div.items-1, div.items-2, div.items-3, div.items-4 {
  clear:both;
  float:left;
  height:auto;
  width: 100%;
  min-height:300px;
  margin:1%
  
  
    }
}


</style>
</head>

<body>

<div class="bgd">
   <div class="items-1"><a href="https://xxxxxxxxxx.com/index.php?route=product/category&amp;path=60"><img  src="http://xxxxxxxxxx.com/image/catalog/ana-2.png"></a> </div> 
  
   <div class="items-2"><a href="https://xxxxxxxxxx.com/index.php?route=product/category&amp;path=60"><img  src="http://xxxxxxxxxx.com/image/catalog/sahmeran.png"></a></div>  <br><br><br><br><br><br><br><br><br><br>
    <div class="items-3"><a href="https://xxxxxxxxxx.com/index.php?route=product/category&amp;path=60"><img  src="http://xxxxxxxxxx.com/image/catalog/kolyes.png"></a></div> 
    
        <div class="items-4"><a href="https://xxxxxxxxxx.com/index.php?route=product/category&amp;path=60"><img  src="http://xxxxxxxxxx.com/image/catalog/kupes.png"></a></div> 


   


</body>
</html>