ASP: Repeater и встраиваемых радиокнопки (прод.)

Question

Это продолжение частично исправленной размещена здесь: ASP:Repeater and embedded radiobuttons

Я сейчас пытаюсь форматировать отображение моих фотографий, так что они по-прежнему работать в горизонтальном направлении, но радиобарабана появляется прямо под каждой фотографией. По умолчанию они отображаются справа от фотографии, используя мой текущий код:

<asp:Repeater ID="repPhotos" runat="server"> 
    <ItemTemplate> 
    <asp:hyperlink id="link" NavigateUrl='<%# Container.DataItem %>' runat="server"> 
     <asp:Image ID="Image" runat="server" ImageUrl='<%# Container.DataItem %>' Height="10%" Width="10%" /> 
    </asp:hyperlink> 
    <asp:RadioButton runat="server" ID="rbPhoto" CssClass="myRadioButton" onclick="radioButtonClick(this)" /> 
    </ItemTemplate> 
</asp:Repeater> 

Это было позже предположил, что я оберните контроль RadioButton с <p> тегами следующим образом:

<asp:Repeater ID="repPhotos" runat="server"> 
    <ItemTemplate> 
    <asp:hyperlink id="link" NavigateUrl='<%# Container.DataItem %>' runat="server"> 
     <asp:Image ID="Image" runat="server" ImageUrl='<%# Container.DataItem %>' Height="10%" Width="10%" /> 
    </asp:hyperlink> 
    <p> 
     <asp:RadioButton runat="server" ID="rbPhoto" CssClass="myRadioButton" onclick="radioButtonClick(this)" /> 
    </p> 
</ItemTemplate> 
</asp:Repeater> 

Но это просто все фотографии отображаются вертикально. Вот то, что до и после вывода выглядит как ...

Answer 1

<p> оберточные радиокнопки будут показывать в качестве элемента блока следовательно причина ваших изображений появляются в вертикальном положении.

Этот HTML/CSS должен сделать трюк, и вы можете настроить запас по желанию:

<style type="text/css"> 
    .photoContainer {float: left; margin: 10px; width:200px;} 
    .radioButton {text-align: center;} 
</style> 
<asp:Repeater ID="repPhotos" runat="server"> 
    <ItemTemplate> 
     <div class="photoContainer"> 
      <asp:HyperLink ID="link" NavigateUrl='<%# Container.DataItem %>' runat="server"> 
       <asp:Image ID="Image" runat="server" ImageUrl='<%# Container.DataItem %>' Height="10%" Width="10%" /> 
      </asp:HyperLink> 
      <div class="radioButton"> 
       <asp:RadioButton runat="server" ID="rbPhoto" CssClass="myRadioButton" onclick="radioButtonClick(this)" /> 
      </div> 
     </div> 
    </ItemTemplate> 
</asp:Repeater>