0

1 行に並べて表示したい 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;
}

このコードは、asp:Repeter コントロール内の Itemtemplate として使用するユーザー コントロール内で定義されています。

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

どういうわけか、これらの div は互いに 1 つの行全体を取ります。

たとえば、次のように表示されます。

ここに画像の説明を入力

ありがとうございました ！

4

1 に答える 1

0

問題は style="width:100%; display:inline;" です from <div style="width:100%; display:inline;" runat="server"> div はデフォルトで display:block 要素であるため、100% の幅を指定する必要はありません。また、display:inline を使用すると、幅は有効になりません。

だからそれを変えるstyle="width:100%;display:inline-block"

この div がフローティング div をラップするために使用される display:inline-block と、display:inline-block がデフォルトの幅を削除するため、幅を指定します。

于 2013-09-28T13:13:01.990 に答える