jquery 모바일에 이미지를 센터링하는 방법은 무엇입니까?

Question

내 모바일 앱에 jquery mobile을 사용하고 있지만 내 이미지를 올바르게 가운데에 배치하는 데 문제가 있습니다. 이미지에서 볼 수 있듯이 이미지의 왼쪽에는 오른쪽에 비해 더 많은 공백이 있습니다. 이것은 페이지의 모든 이미지에 대해 일관되게 발생합니다.

자세한 내용은 넓이가 아닌 그림이 중앙에있는 것처럼 보이지만 그 이미지의 왼쪽/오른쪽 공백에도 약간의 차이가 있음을 확신합니다. 이것은 더 넓은 이미지를위한 것입니다.

해결 방법에 대한 조언이 있으십니까?

  $("#allpictures").append('<div class = "img_center"><div><img src = "'+item.url+'"></div></div><p style = "margin-left:10px; margin-right:10px; font-size:15px;">'+item.title+'</p><br/>'); 

    <style> 
     .img_center { 
      text-align:center; 
     } 
     .img_center * { 
      margin: 0 auto; 
     } 
    </style> 

Answer 1

사용이 CSS, 그리고 <p>에 인라인 style 속성을 제거합니다. .append에서

.img_center{ 
    text-align: center; 
    width: 100%; 
} 
.img_center img{ 
    display: block; 
    margin: 0 auto; 
} 
.img_center p{ 
    margin: 10px; 
    font-size: 15px 
} 

HTML :

$("#allpictures").append('<div class="img_center"><img src="'+item.url+'"></div><p style="margin-left:10px; margin-right:10px; font-size:15px;">'+item.title+'</p><br />');