在ItemTemplate Repeater ASP.NET中的Div大小

Question

我有3个div标签，我想在一行中并排显示。

它们位于主div内：

<div class="dvItemContainer">
  <div class="nameContainer">content-1</div>
  <div class="quantityDiv">Content-2</div>
  <div class="dvLnkContainer">Content-3</div>
</div>

The classes are:

.dvItemContainer
{
    width:250px;
    float:right;
    cursor:pointer;
    overflow: hidden;
    max-width:250px;
}
.nameContainer
{
    width:150px;
    float:left;
    max-width:150px;
    overflow:hidden;
}
.quantityDiv
{
    width:60px;
    float:right;
}
.dvLnkContainer
{
    width:40px;
    float:right;
    right:0;
    visibility:visible;
}

此代码在用户控件中定义，我用作Itemtemplate unside asp：Repeter控件。

<ItemTemplate>
   <div style="width:100%; display:inline;" runat="server">
      <prod:ProductItemTagName ID="productItem" width="100%" runat="server" />
   </div>
</ItemTemplate

不知何故，这些div对彼此占了一整排。

例如它显示如下：

谢谢！

Answer 1

问题是style =“width：100％; display：inline;”从 <div style="width:100%; display:inline;" runat="server"> div默认是display：block元素，所以你不需要给它100％的宽度 如果你使用display：inline，宽度将无效

因此请使用style="width:100%;display:inline-block"

进行更改

显示：用于使此div包装浮动div的内联块 我们给它宽度作为显示：inline-block删除默认宽度