显示 属性 - 具有行内宽度的块行为

Question

我正在尝试通过 AccordionPane 获得 "block" 显示效果，以便窗格按间距垂直对齐。但是使用 display:block; 将拉伸窗格的 header 以适应整个可用宽度。 使用 display:inline; 会得到我想要的宽度行为，但随后会水平堆叠窗格，没有间距。

例如，"Basic Info" 是带有 display: block; 的未选中窗格。我想要 "Features" 的窗格宽度 display: inline;

但是，这样做会导致以下结果：

不仅未选中的面板在水平方向上混在一起，顶部也从“内容”窗格中被截断。

我希望所有面板的宽度都适合内容，但垂直堆叠时要保持 display: block; 中的清晰间距。这可能吗？

这是 aspx 片段：

<ajaxToolkit:Accordion
                     ClientIDMode="Static"
                     runat="server"
                     AutoSize="None"
                     Height="500"
                     ContentCssClass="accordion"
                     HeaderCssClass="accordionHeader"
                     HeaderSelectedCssClass="accordionHeaderSelected"
                     BorderStyle="None"
                     style="outline: none; vertical-align: top;"
                   >

Answer 1

可以，但您需要将它们浮动 float:left; clear: both，或者为您的项目设置固定宽度并使用 display:block。

如果您需要设置垂直边距的功能，也可以使用 display:inline-block。

Answer 2

要获得此行为，我需要将其设置为 display: table;