2012-08-07 61 views
0

我有以下的列表视图在我的aspx页面ItemTemplate中的列表视图 - 布局问题

<asp:ListView ID="ListView1" GroupItemCount="4" runat="server" 
    DataKeyNames="contentid" DataSourceID="sqldsPhotos"> 
<LayoutTemplate> 
    <asp:Placeholder 
    id="groupPlaceholder" 
    runat="server" /> 
</LayoutTemplate> 
<GroupTemplate> 
    <div> 
    <asp:Placeholder 
    id="itemPlaceholder" 
    runat="server" /> 
    </div> 
</GroupTemplate> 
<ItemTemplate> 

    <asp:Image id="picAlbum" runat="server" 
     ImageUrl='<%# "ShowImage.ashx?id=" + Convert.ToString(Eval("contentid")) %>' 
     Height="108" Width="192" /> 
    <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton> 
    </ItemTemplate> 
<EmptyItemTemplate>   

</EmptyItemTemplate> 
</asp:ListView> 

产生的网页显示我的形象与它旁边的链接按钮。我想要的是每个项目都以Linkbutton为中心的图像。

有人可以帮助我与必要的HTML或CSS来实现这一目标。

回答

0

尝试使用以下的html内部ItemTemplate

<div style="float: left; margin-left: 10px; text-align:center;width: 192; "> 
    <asp:Image id="picAlbum" runat="server" 
     ImageUrl='<%# "ShowImage.ashx?id=" + Convert.ToString(Eval("contentid")) %>' 
     Height="108" Width="192" /> 
    <asp:LinkButton ID="LinkButton1" runat="server" 
     style="display: block; clear: both;">LinkButton</asp:LinkButton> 
</div> 

上面的代码将通过侧显示的div侧。所以按顺序显示4个div添加(800px)到列表视图中的项目。

如果你没有得到linkbutton在中心添加一些margin-left它显示在中心。

+0

不幸的是这并没有让我我需要什么。我的照片和链接仍然是并排的。这个标记只是将它们放在容器中。我需要的是图片下方的链接。这是它最初看起来像[之前](http://stackstuff.tumblr.com/image/28976949852),这是它添加div标签[后](http://stackstuff.tumblr.com/image/28976962386) – user1247395 2012-08-08 12:08:44

+0

我正在寻找具有下方链接的照片,并每隔4行进行一次。 – user1247395 2012-08-08 12:12:08

+0

您应该添加这些问题。否则,某人会如何知道,你需要什么。我已经相应地改变了答案。让我知道是否需要其他东西。 – Narendra 2012-08-09 04:25:34

0

试试这个:

<div style="width: 192px; text-align:center;"> 
    <asp:Image id="picAlbum" runat="server" 
     ImageUrl='<%# "ShowImage.ashx?id=" + Convert.ToString(Eval("contentid")) %>' 
     Height="108" Width="192" /><br/> 
    <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton> 
</div>