XPages - Аккордеонный сосуд Dojo с панелями Autohieght

Question

У меня есть Аккордеон с панорамой. Что бы я ни делал, я не мог решить свою проблему. Высота аккордеонной панели всегда такая же, как у самой Аккордеонной панели.

Я просто хочу, чтобы он был достаточно высоким в соответствии с его содержанием. Я имею в виду автоматически высокий.

Answer 1

Добавить CSS в ваш XPage или темы:

.dijitSelected .dijitAccordionContainer-child { 
    height: auto !important; 
} 

Dojo панель аккордеона, открытая с правильная высота.

---

Использовать тему «Bootstrap3.2.0» в качестве альтернативы, так как гармония работает с этой темой из коробки, как ожидалось.

Answer 2

Я сделал некоторые исследования и, на мой взгляд, проблема может быть решена путем установки свойства высоты CSS height:auto !important; на каждом xe:basicContainerNode НО, если вы открываете/закрыть панель аккордеона то свойство высота будет перезаписан :(

XPage Источник:

<xe:accordion id="accordion1"> 
    <xe:this.treeNodes> 
     <xe:basicContainerNode label="Container one"> 
      <xe:this.children> 
       <xe:basicLeafNode submitValue="Container one, choice one" label="Choice one"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container one, choice two" label="Choice two"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container one, choice three" label="Choice three"></xe:basicLeafNode> 
      </xe:this.children> 
     </xe:basicContainerNode> 
     <xe:basicContainerNode label="Container two" style="height:auto !important;"> 
      <xe:this.children> 
       <xe:basicLeafNode submitValue="Container two, choice one" label="Choice one"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container two, choice two" label="Choice two"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container two, choice three" label="Choice three"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container two, choice one" label="Choice one"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container two, choice two" label="Choice two"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container two, choice three" label="Choice three"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container two, choice one" label="Choice one"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container two, choice two" label="Choice two"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container two, choice three" label="Choice three"></xe:basicLeafNode> 
      </xe:this.children> 
     </xe:basicContainerNode> 
     <xe:basicContainerNode label="Container three"> 
      <xe:this.children> 
       <xe:basicLeafNode submitValue="Container three, choice one" label="Choice one"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container three, choice two" label="Choice two"></xe:basicLeafNode> 
       <xe:basicLeafNode submitValue="Container three, choice three" label="Choice three"> 
       </xe:basicLeafNode> 
      </xe:this.children> 
     </xe:basicContainerNode> 
    </xe:this.treeNodes> 
</xe:accordion> 

Firebug Скриншоты:

После XPage загружен:

После Pane Открыт/Закрыт: