CSS 래퍼를 사용하여 이미지 왼쪽 여백을 패딩

Question

이미지 왼쪽에 원하지 않는 패딩이 있습니다 (아래 코드 참조). CSS에서 .wrapper-shadow의 모든 코드 행을 변경, 삭제 또는 대체하려고 시도했습니다. 행운이 없습니다. 이 오류는 Firefox, Chrome 및 Explorer에서 나타납니다. 흥미롭게도 오류가없는 동일한 사이트의 태블릿 및 모바일 페이지에 대해 매우 유사한 코드가 있습니다. 나는 태블릿 CSS와 HTML을 데스크톱 코드로 대체하려고 시도했지만 어쨌든 오류가 나타났다. See attached image of the problem.

흥미로운 점은 : 타블렛 및 모바일 사이트 (올바르게 표시되는)는 데스크톱 사이트보다 왼쪽 여백이 좁습니다. See attached image of margin difference. 내 맞춤 부트 스트랩 CSS의 모든 행을 검색하여 데스크톱과 태블릿 스타일 시트의 차이를 찾을 수 있는지 확인했습니다. 다시 운이 없었습니다. 어떤 도움이라도 대단히 감사하겠습니다. 감사. 불순한 산화 코발트

.wrapper_shadow{ 
 
\t max-width: 765px; 
 
\t background-color: #9ebade; 
 
\t border: thin solid #758fa9; 
 
\t -webkit-box-shadow: 2px 2px 5px 2px #758fa9; 
 
\t box-shadow: 2px 2px 5px 2px #758fa9; 
 
\t margin-bottom: 15px; 
 
\t padding-left: 0px; \t 
 
}

<div class="container-fluid"> 
 
    <div class="pageHeaderText">Virtual performance art made with Unity3D game creation software</div> 
 
    <div class="row"> 
 
    <div class="col-sm-6"> 
 
     <div class="wrapper_shadow center-block"> 
 
     <img src="images/ColorCubed_765.jpg" class="img-responsive center-block" alt="ColorCubed"/> 
 
     </div>

Answer 1

난 그냥 대답을 자신을 발견했다. 몇 분 후에 당신의 두뇌에 때로는 답변을 팝업으로 올릴 수있는 충분한 질문을 생각하는 것이 얼마나 멋진가요.

나는 "padding-left : 5px;"라는 라인을 사용했다. 계단식으로 내려가 내 styles.css에서 오류가 발생하는 부모 bootstrap.css의 * {} 스타일. (아래 코드 참조). 오류가 자신의 스타일 시트가있는 태블릿이나 모바일이 아닌 내 사이트의 데스크톱 버전에만 나타났습니다는 단서가있었습니다. 이야기의 도덕은 항상 당신의 계곡을 점검하는 것입니다. 감사. 불순한 산화 코발트

* { 
 
\t -webkit-box-sizing: border-box; 
 
\t -moz-box-sizing: border-box; 
 
\t box-sizing: border-box; 
 
\t padding-left: 5px; 
 
}