セマンティックUIの設定方法ボタンなどに合わせたドロップダウンサイズ

Question

セマンティックUIは、多くのものに共通のサイジングを適用する素晴らしい方法です。ボタン（セマンティックUIで反応）：多くの場合、単にボタンのように見えるとボタンで行の上に置かれ、「サイズ」パラメータを取るためには表示されません

<Button size="tiny" /> 

しかしドロップダウン、。

https://react.semantic-ui.com/modules/dropdown

例えば、他の要素にとドロップダウンに同じサイズを適用するための良い方法はあります行のボタン？ （つまり、カスタムCSSで操作するだけでなく、保守性の高いもの）

Answer 1

私は、これはあなたがドロップダウンとsize attributを使用して、ボタンのような別のコンポーネント間で同じサイズを作成したい場合は、ボタンの内側にドロップダウンを置くことができていると思う：

import React from 'react' 
import { Dropdown, Menu, Button } from 'semantic-ui-react' 

const options = [ 
    { key: 1, text: 'Choice 1', value: 1 }, 
    { key: 2, text: 'Choice 2', value: 2 }, 
    { key: 3, text: 'Choice 3', value: 3 }, 
] 

const DropdownExampleSimple =() => (
    <div> 
    <Button size="tiny" > 
     <Dropdown text='Dropdown' options={options} simple item /> 
    </Button> 
    <Button size="tiny"> 
     This is Button 
    </Button> 
    </div> 
) 

export default DropdownExampleSimple 

これが結果です：

はたぶん、あなたはボタンとドロップダウンリグ間で同じサイズを作成したいのおかげ