예쁜 잡지 레이아웃/marketing-esq 브로셔 이외의 여백을 적용하는 경우 http://960.gs 또는 http://blueprintcss.org을 사용하는 시점이 없습니다. 헤더를 실제로 감싸고 감쌀 수있는 네비게이션과 같은 특정 디자인 요구 사항을 충족시키는 데 사용할 수있는 방법이 있습니까? 이러한 프레임 워크를 여백없이 사용할 수있는 모든 입력은 (적은 CSS 전문가 수준의 개발자에게 브라우저 호환성을 적용하는 것처럼) 이상적입니다. (참고 : 우리는 JSF를 사용하고 있습니다. 웹 상점이 아닌 개발 상점이기도합니다)CSS 프레임 워크 (예 : 960gs 또는 Blueprintcss)를 여백없이 사용할 수 있습니까?
나는 나의 궁극적 인 CSS 레이아웃 기법으로이 기술을 사용
http://www.codeofficer.com/blog/entry/css_grid_frameworks_960gs_without_margins/
내가 한 번 같은 문제가 있고, 내가 한 모든 마진 두통이 사라지게을 가지고 사용하기 때문에. ! important을 사용하면 사용자 정의 너비/높이를 사용해야합니다.강령 :
<div class="g_9 content_main">
This div should actually have 720px in width.
But I overide it using another class so now the width has become 700px,
and just in case it needs custom margin, we can always set it in the css :)
</div>
CSS의 :
.c_12 .g_9, .c_16 .g_12 { width: 720px; } /* 960-full.css */
.content_main { width: 700px !important; margin-left: 15px;} /* style.css */
사이트의 모든 div에 대해 그리드 클래스를 사용할 필요는 없습니다. 헤더가 그리드 레이아웃을 따를 필요가 없다면 헤더에 대한 스타일을 직접 만드십시오. 그리드를 완전히 건너 뛸 수 있으며 양식 & 인쇄 마크 업을 사용하면됩니다. 이 프레임 워크는 프로젝트에 약간의 일관성을 부여하려는 시도입니다.
주요 콘텐츠에는 청사진을 사용하고 있지만 헤더 영역에는 자체 맞춤 레이아웃이 있습니다.
여기에 프레임 워크를 다시 작성하지 않고, 당신이 터치 요소를 생성하는 데 도움이 960gs와 함께 작동 내가 쓴 모드가 있습니다.