스켈레톤 그리드의 마진 감소

Question

960px 그리드에서 유체/전체 너비 부분을 완전히 손상시킬 수 있습니까?

사이트를 만들고있는 사람은 말하기 섹션의 이미지가 잘리 (단축됨)되기를 원하므로 3 열 모두를 넓히지 않는 한 다른 2 열보다 짧아집니다. 난 단지 그것들을 1/3 칼럼의 뼈대 폭으로 정의해야합니다. 계속하면서 넓은 (보다 960 PX)를 행/전체 부분을 따라서 세 열의 폭을 증가 화면 전체에 걸쳐/스팬 : 말하기 섹션

는 만들기 위해 쉽게 방법이있다 골격 격자에 의해 정의됩니다.

(. 쉽게가 나는 해골 CSS에 대한 최소한의 조작을 의미)

URL : http://tinyurl.com/qbrjqne

<section> 
    <h3 id='speaking'></h3> 
    <div class="container">    
     <div class='one-third column'></div> 
     <div class='one-third column'></div> 
     <div class="one-third column"> 
      <section class='whitemission'> 
      </section> 
     </div> 
    </div> 
</section> 

--- base/main style --- 

@media only screen and (max-width: 767px) and (min-width: 480px) 
.container .one-third.column, .container .eight.columns, .container .four.columns {margin: 50px 0; padding: 45px 0;} 

-- skeleton-- 
.container { position: relative; width: 960px; margin: 0 auto; padding: 0; } 
.container .column, 
.container .columns { float: left; display: inline; margin-left: 10px; margin-right: 10px; } 
.container .one-third.column { width: 300px; } 

Answer 1

이 쉬운 방법 중 하나는 첫 번째 열을 설정하는 것에 "6 개 열 두 번째와 세 번째는 "다섯 개의 기둥"입니다. 그러면 이미지는 텍스트 - 칼럼보다 약간 넓을 것입니다. 어쩌면 자른 이미지에 조금 더 잘 어울릴 것입니다.

그러나 이미지는 960 크기의 눈금처럼 768에서 960 크기의 눈금에도 잘 맞지 않습니다.

수정하려면 자른 이미지를 다르게 표시 할 수 있습니다. 괜찮 으면. 나는 그것이 더러워 질 것임을 안다. 그러나 그것은 꽤 쉽다. ;)