Question

我有一个下拉菜单＆amp;表格单元格内的按钮。此下拉列表必须包含锚点和按钮。我无法控制用锚点替换按钮元素，但是，我希望按钮看起来就像标准的Bootstrap菜单项一样，所以我就像锚点一样设置样式，但是项目的宽度发生了奇怪的事情。当位于桌子内时，下拉列表将增长到最大锚点的大小，但不会是最大的按钮。但是，当在表格外部时，下拉菜单会完美地增加到按钮的大小。

我把小提琴放在一起显示问题：

http://jsfiddle.net/5p341amh/205/

<table>
    <tbody>
        <tr>
            <td>
                <div class="dropdown">
                <button class="btn btn-default"
                        data-toggle="dropdown">
                    <span id="dropdown_title2">Select Something</span>
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu" >
                    <li><a tabindex="-1" href="#">Fooooooooooo</a></li>
                    <li><button tabindex="-1" href="#">Baaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaar</button></li>
                    <li><button tabindex="-1" href="#">Baz</button></li>
                </ul>
                </div>
            </td>
        </tr>
    </tbody>
</table>

如何解决这个问题的任何见解都会很棒！谢谢！

Answer 1

我不知道我是否理解你的答案，但你不需要添加一个按钮元素并将锚标记放入其中。您只能添加锚标记并将其设置为按钮。<a href="#" id="button" class="btn btn-primary " >Baaaaaaaaaaa</a>

Answer 2

试

display: table;
max-width: 300px /* or set your specified max-width */;

样式引导下拉按钮与Firefox上的表内的Anchor相同

2 个答案: