DisclosurePanel 스타일링 버그?

Question

내 문제는 다음과 같습니다. 아래에 표시된보기로 이동하면 disclosurepanel이 그리드와 큰 거리를 가지며 공개 패널 헤더를 클릭하면 "선택 테두리"가 나타납니다.하지만 브라우저를 새로 고침하면 모든 것이 그것이 있어야하는 위치에 그리고 disclosurepanel 헤더는 클릭 할 때 더 이상 선택되지 않습니다.

<g:HTMLPanel> 
    <g:VerticalPanel> 
     <g:Grid> 
      <g:row> 
       <g:customCell> 
        <g:Button ui:field="editBTN" width="50px"></g:Button> 
       </g:customCell> 
       <g:customCell> 
        <g:Button ui:field="deleteBTN" width="50px"></g:Button> 
       </g:customCell> 
       <g:customCell> 
        <g:Label ui:field="date" width="100px"></g:Label> 
       </g:customCell> 
       <g:customCell> 
        <g:Label ui:field="begin" width="100px"></g:Label> 
       </g:customCell> 
       <g:customCell> 
        <g:Label ui:field="end" width="100px"></g:Label> 
       </g:customCell> 
       <g:customCell> 
        <g:Label ui:field="pause" width="100px"></g:Label> 
       </g:customCell> 
       <g:customCell> 
        <g:Label ui:field="sum" width="100px"></g:Label> 
       </g:customCell> 
       <g:customCell> 
        <g:Label ui:field="tasks" width="100px"></g:Label> 
       </g:customCell> 
      </g:row> 
     </g:Grid>  


      <g:DisclosurePanel> 
       <g:header>test</g:header> 
      </g:DisclosurePanel> 
      <g:DisclosurePanel> 
       <g:header>test</g:header> 
       <g:Grid> 
       <g:row> 
        <g:customCell> 
         <g:TextBox ui:field="fromDATEtbx" width="100px"></g:TextBox> 
        </g:customCell> 
        <g:customCell> 
         <g:TextBox ui:field="toDATEtbx" width="100px"></g:TextBox> 
        </g:customCell> 
       </g:row> 
      </g:Grid>  
      </g:DisclosurePanel> 
    </g:VerticalPanel> 
</g:HTMLPanel> 

이 알려진 버그/실수 : 나는 이런 ui.xml가 있나요?

Answer 1

문제가 해결되었습니다. 어떻게 든 당신의 스타일에

td { padding: 8px; }

을 추가합니다. 난 그저 내 uibinder에

td { padding: 0px; }

을 설정합니다.

Answer 2

디버그 모드에서 작업 할 때 내 공개 패널에 대해 때때로이 "선택 테두리"를 발견했습니다. 그래도 프로덕션 모드에서는 이것을 보지 못했습니다. 당신이 정말로 꼭 그 효과를 제거해야하는 경우

것은, 당신은 당신의 disclosurePanel.getHeader().getParent()에 "outline: none;"를 설정하려고 할 수있는 것입니다에 대한 (일반적으로 새로운 브라우저에 적극적으로 집중 요소 OK입니다) 강조 표시된 경계를 보여주는 방지 <a href=...> 공개 패널의 머리글을 래핑하는 요소입니다.

예기치 않은 요소 사이의 간격을 볼 때 devtools에서 해당 헤더의 상황을 확인할 수도 있습니다. 새로 고침을 한 후 그 내용과 비교하십시오. 그래서 차이점을 발견하고 그 원인을 찾아 낼 수 있습니다.