2012-08-23 5 views
0

container_12 인 960 그리드 시스템을 사용하고 있습니다. 문제는 2 grid_6 col이고 텍스트가 겹쳐서 사용하고 있습니다. overflow 속성을 auto으로 설정하려고하면 스크롤 패널이 표시되지만 텍스트가 너비 뒤의 다음 줄로 이동하지 않습니다.css 960 그리드 시스템 문제

 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <link href="css/960.css" rel="stylesheet" type="text/css" /> 

    <link href="css/reset.css" rel="stylesheet" type="text/css" /> 
    <link href="css/text.css" rel="stylesheet" type="text/css" /> 
    <link href="css/Style.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div id="body" class="container_12"> 

    <div id="header" class ="grid_12">This is header</div> 
    <div id="nav" class="grid_3"> 
    Navigation 
    <ul> 
    <li><a href ="google.com">Google</a></li> 
    <li><a href ="yahoo.com">yahoo</a></li> 
     <li><a href ="bing.com">bing</a></li> 
    </ul> 
    <p>dcjkldsjfkdjkljdsklvjkjvkdjkfljdskfjkdsjfkldjsfkjdksjkfjkd</p> 
    </div> 
    <div class="grid_9" > 
    <div id="content"> 
    <h1>Content</h1> 
    <p>The premise of the system is ideally suited to rapid prototyping, 
    but it would work equally well when integrated into a production environment. 
    There are printable sketch sheets, design layouts, and a CSS file that have identical measurements.</p></div></div> 
        </div> 
        </form> 
        </body> 
        </html> 
Problem here-: 
<p>dcjkldsjfkdjkljdsklvjkjvkdjkfljdskfjkdsjfkldjsfkjdksjkfjkd</p> 
+2

css 및 html을 게시하십시오. –

+0

내가 수정했는지 확인하십시오. – user1609429

답변

1

당신은 예를 들어, 그리드 내부 용기의 한 수준을 가지고 있는지 확인하십시오 : 당신이 당신의 콘텐츠 영역에 패딩을 추가 그리드 내부에 별도의 사업부를 추가하려면

<div class="container_12"> 
    <div class="grid_6"></div> 
    <div class="grid_6"></div> 
</div> 

,하지 그리드 자체에 패딩을 추가하십시오.

<div class="container_12"> 
    <div class="grid_6"><div class="space"></div></div> 
    <div class="grid_6"><div class="space"></div></div> 
</div> 
+0

귀걸이를 확인했는데 이제는 교차 확인했습니다.하지만 첫 번째 div의 내용이 두 번째로 겹칩니다. 1. 매우 좌절감을 가지고 무엇을 해야할지 모릅니다. – user1609429

+0

jsfiddle에 코드를 붙여 넣거나 붙여 넣을 수 있습니까? 특정 설정을 볼 수 있습니까? – zenkaty

+0

편집했습니다. – user1609429

0

나는 동일한 문제가있었습니다. 나는 "grid_3"을 가지고 거기에 더미 컨텐츠를 넣었지만 div에서 쏟아져 나갔다. 나는 또한 어떻게 보였는지보기 위해 끝과 끝을 복사하여 붙여 넣었다. 나는 돌아가서 단어들 사이에 공백을 넣었고 완벽하게 작동합니다. div 외부로 확장되지 않으면 수직으로 멈추고 확장됩니다. 어떤 종류의 버그 나 결함이 960에서입니까?

관련 문제