Div 's not responsive [foundation]

12 열 그리드를 사용하여 PS 레이아웃을 디자인했으며 Wordpress에서 작동하게하고 싶습니다. Reverie 테마는 Foundation에서 작동하는 프레임 워크 테마입니다.Div 's not responsive [foundation]

나는 내 머리글이 잘 작동하도록해야하지만 아래 내용은 화면 크기에 맞지 않을 것입니다. 아픈 포스트 코드 I는 다음과 같습니다

page.php :

<?php get_header(); ?> 
<div class="container"> 
<!-- Row for main content area --> 
    <div class="large-12 medium-12 small-12 columns" id="content" role="main">  
     <div id="top-content" class="large-12 medium-12 small-12"> 
     </div> <!-- end top-content"> 

     <footer> 
      <center><p class="copy">&copy; <?php echo date('Y'); ?> Roelof Plas. Ontwerp door <a href="http://roelofplas.nl" rel="nofollow" title=""><span class="roelof">roelofplas.nl.</span></a> Alle rechten voorbehouden.</p></center> 

     </footer> 
    </div> 
</div> 
<?php get_footer(); ?>

있는 style.css :이 같이하기로했다 무엇

#top-content { 
    width: 1140px; 
    height: 530px; 
    background-color: #63bcb8; 
    z-index: 1000; 
    top: -48px; 
    position: absolute; 
}

(단지 turquase의 DIV를) :

이미지를 게시 할 수 없습니다. (2 명 이상 필요) click this.

라이브 버전 : click me

내가 잘못 뭘하는지 알려주세요. 재단 및 그리드 등에 관한 튜토리얼을 많이 읽었지 만 제대로 이해할 수는 없습니다.

나에게서 더 많은 정보가 필요하면 알려주세요.

감사합니다,

뢸 PLAS

Joel BY 솔루션, 감사 짝! 아직 u를 rep 수는 없지만 할 수있을 때 나는 할 것입니다! : D

출처

2014-09-11 Roelof Plas

"너비 : 1140px; # 탑 컨텐츠 클래스에서 .columns 및 .large-12, .medium-12 등이 기초에서 응답을 처리합니다.

바닥 글이 표시되지 않는 이유는 두 가지입니다. 하나는 position : absolute를 #position-relative로 대체해야합니다. position : absolute를 사용하면 DOM 흐름에서 DIV를 가져와 바닥 글이 '뒤에서'숨겨집니다.

또한 닫히지 않은 의견이 있습니다

끝 상단 내용 "> 위 내용을 종료해야합니다 - 그와>

다음 올바르게 표시해야합니다 바닥 글을 변경하고 주요 청록색 DIV가 될 것입니다 반응 형.

출처

2014-09-11 11:33:14 Joel

고마워요. 저는 wikijames를 잘 이해하지 못합니다. 어떤 종류의 너비 그래서 나는 매력처럼 일한 당신의 awnser을 tryd. –

> You haven't used "columns" class on this. 
> You don't required any kind of width when you applying "-12" in every class. 
> And if you still willing to provide height on this **ID** "#top-content". then use media query to give width on every other size. 

<div id="top-content" class="large-12 medium-12 small-12">

출처

2014-09-11 11:02:55 wikijames

이 도움말을 통해 문제가 해결 된 경우 답변을 올바르게 확인하십시오 – wikijames

답장을 모두 이해할 수 없지만 시간을내어 설명해 주셔서 감사합니다. 감사합니다 < 3 –

신경 쓰지 마라. 괜찮아. – wikijames

Div 's not responsive [foundation]

답변

관련 문제