2017-12-27 17 views
2

그래서 클라우드 9 편집기를 사용하여 Instagram 형 페이지를 만듭니다. 이 템플릿은 루비 레일에 있지만이 파일에는 HAML도 사용하고 있습니다. 애플리케이션을 실행하면 오류가 발생합니다. 불법적 인 중첩 : 콘텐츠를 % div와 동일한 행에 둘 수 없으며 그 안에 중첩됩니다. 그 전에 들여 쓰기가 잘못되었다는 오류가있었습니다. 한 가지 질문은 탭이나 공백을 사용해야합니까? 두 번째 질문은이 문제를 해결하는 방법입니다. "불법 중첩 : 콘텐츠를 % div와 같은 줄에 둘 수는 없으며 그 안에 중첩 된 내용을 포함 할 수 있습니까?" 오류는 16 행에 있습니다 : .collapse.navbar-collapse#bs-navbar-collapse-1 미리 감사드립니다! 당신이 LINK_TO을 가지고 있기 때문에
불법 중첩 : % div와 같은 줄에 내용을 넣을 수 없습니다. 내 안에 내용을 넣을 수 없습니다.

%html 
%head 
    %title Photogram 
    = stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true 
    = javascript_include_tag 'application', 'data-turbolinks-track' => true 
    = csrf_meta_tags 
%body 
    %nav.navbar.navbar-default 
    .navbar-container 
    .navbar-header 
    %button.navbar-toggle.collapsed{"data-target" => "#bs-navbar-collapse-1", "data-toggle" => "collapse", type: "button"} 
    %span.sr-only Toggle Navigation 
    %span.icon-bar 
    %span.icon-bar 
    .navbar-brand= link_to "Photogram", root_path 
     .collapse.navbar-collapse#bs-navbar-collapse-1 
     %ul.nav.navbar-nav.navbar-right 
     %li 
     = link_to "New Post", new_post_path 
     %li 
     = link_to "Login", '#' 
     %li 
     = link_to "Register", '#' 

    .container 
    = yield 
+0

어떤 줄이 오류입니까? – CherryPlaysRoblox

+0

@CherryPlaysRoblox 오, 알려 주셔서 감사합니다, 내가 편집했습니다. 16 행 .collapse.navbar-collapse # bs-navbar-collapse-1' – iiRosie1

답변

0

그것은, 그리고 다음 내부 중첩있어 :

다음은 내 application.html.haml입니다. this answer here을 확인하고 코드를 변경하십시오. 또한 자습서를 따르는 경우 코드를 확인하고 오류가 있는지 확인하십시오.

+0

??? 나는 네가 의미하는 바를 얻지 못했지만 지금은 효과가있다. – iiRosie1

+0

@ iiRosie1 내용을 동일한 줄과 그 안에 넣을 수 없습니다. 오류는 또한 당신이 잘못한 것을 설명합니다. – CherryPlaysRoblox

0

해결책 들여 쓰기가 정확하지 않았습니다. 그래서 나는 돌아가서 각 들여 쓰기가 어떻게되는지를 확인했습니다. 이제 코드는 다음과 같습니다.

%html 
%head 
    %title Photogram 
    = stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true 
    = javascript_include_tag 'application', 'data-turbolinks-track' => true 
    = csrf_meta_tags 
%body 
    %nav.navbar.navbar-default 
    .navbar-container 
     .navbar-header 
     %button.navbar-toggle.collapsed{"data-target" => "#bs-navbar-collapse-1", "data-toggle" => "collapse", type: "button"} 
      %span.sr-only Toggle Navigation 
      %span.icon-bar 
      %span.icon-bar 
     .navbar-brand= link_to "Photogram", root_path 
     .collapse.navbar-collapse#bs-navbar-collapse-1 
     %ul.nav.navbar-nav.navbar-right 
      %li 
      = link_to "New Post", new_post_path 
      %li 
      = link_to "Login", '#' 
      %li 
      = link_to "Register", '#' 

    .container 
    = yield