2011-10-02 1 views
0

Blueprint CSS 프레임 워크를 사용할 때 모든 열 사이의 여백을 제거하려고했습니다. 불행히도 이러한 여백을 제거하면 모든 열에 걸쳐있는 div가 마진이 제거 된 행에 div가 합쳐진 총 너비보다 넓어집니다. 많은 컬럼을 가진 행에서는 효과가 더 나쁩니다.중간 열의 여백을 제거 할 때 div의 오른쪽 가장자리가 일렬로 정렬되지 않음

모든 24 개의 열을 사용하는 행의 경우 div의 오른쪽 가장자리를 정렬해야합니다. 이 문제는 수많은 청사진 해킹에 의존하지 않고 누락 된 마진을 설명하기 위해 적절한 수의 픽셀 만 사용하여 컨테이너 또는 무언가의 크기를 수동으로 조정하지 않고도 해결할 수 있습니까? 머리에

코드 : 몸에

<style type="text/css"> 
     .topnav{background-color:blue;} 
     .logo{background-color:yellow;} 
     .icons{background-color:orange;} 
     .search{background-color:red;} 
</style> 

코드 :

<div class="container"> 
     <div class="span-24 first last top topnav">Top Nav</div> 
     <div class="span-5 first logo">Logo</div> 
     <div class="span-3 append-8 icons">Icons</div> 
     <div class="span-8 last bottom search">Search</div> 
</div> 

답변

2

정말 (내가 그런 경우 의심하지 않지만, 더 많은 정보 없이는 내가 할 수없는 열 사이 여백을 제거해야하는 경우 더 많은 도움을 제공하십시오) 그러면 가장 좋은 것은 전체 그리드를 다시하는 것입니다. 청사진을위한 생성기는 다음과 같습니다. 열 사이의 마진 (여백 사이의 여백)을 비롯하여 필요한 모든 변수를 지정할 수 있습니다. http://ianli.com/blueprinter/

+0

내 디자인에 대해 내 생각에 다시 한 번 의견을 듣게되었습니다. 나는 마진을 제거 할 필요가 없다는 것이 맞다고 생각합니다. 마진이 없어야하는 인접한 이미지가 염려되지만 배경이 부모 div 내에서 처리 될 수 있습니다. 귀하의 청사진 제안은 내가 설명한 문제도 해결합니다. 고맙습니다! – SF1Dev