Элементы XUL для переноса строк - PullRequest
Новая
       5

Элементы XUL для переноса строк

2 голосов
/ 09 декабря 2011

Рассмотрим следующее: 

<groupbox id="keyboard" orient="horizontal">
        <button id="a" label="a" class="thinbutton"/>
        <button id="b" label="b" class="thinbutton"/>
        <button id="c" label="c" class="thinbutton"/>
</groupbox>

Это часть диалогового окна в расширении Firefox. У меня есть некоторый JavaScript, добавляющий различное количество кнопок в элемент groupbox (приведенные выше более или менее просто иллюстративны). Обычно порядка 40-80 кнопок. Они бегут от края окна, и единственный способ добраться до них - изменить размер окна. Я бы хотел, чтобы они завершились в конце, так же, как текст в текстовом элементе. Я видел еще один, казалось бы, уместный вопрос по этому поводу, и решение состояло в том, чтобы обернуть кнопки в тег <description>, но это, похоже, не работает для меня.

Какие правильные атрибуты CSS или XUL следует использовать для переноса элементов XUL?

1 Ответ

2 голосов
/ 10 декабря 2011

Обертывание кнопок в элементе <description> - вот путь, но вы должны не забыть добавить атрибут flex="1" (элемент <description> должен охватывать всю ширину элемента <groupbox>, а не растянуть до его содержания. Это работает для меня: 

<groupbox id="keyboard" orient="horizontal">
  <description flex="1">
    <button id="a" label="a" class="thinbutton"/>
    <button id="b" label="b" class="thinbutton"/>
    <button id="c" label="c" class="thinbutton"/>
    ...
  </description>
</groupbox>
...