Использование меню внутри значка без разрыва строки. Из-за bootstrap рамки - PullRequest
0 голосов
/ 09 января 2020

Мне нужно отобразить меню внутри значка (от реакции- bootstrap), поэтому я попробовал следующее:

<div className="container">
     <Label className="nowrap"><span>Rule <OverflowMenu/></span></Label>
     <Badge variant="secondary" className="nowrap">Rule<OverflowMenu/></Badge>
</div>

и с этим css:

.container {
  /*display: inline-block;*/
  display: inline-flex;
}

.nowrap{
  /*display: inline-block;*/
  white-space: nowrap;
  /*float: left;*/
}

Но я получаю меню в новой строке!

enter image description here

Обновление

Я думаю, что это связано с OverflowMenu response-carbon-components, когда я использовал другой элемент, например Icon, новой строки нет.

При добавлении важных атрибутов nowrap css я получил что-то вроде этого:

enter image description here

.nowrap{
  display: flex !important;
  white-space: nowrap !important;
  /*float: left !important;*/
}
...