Проблема с CSS (плавающая) в ListView ItemTemplate!

Я новичок в CSS и имею проблему с стилем управления ListView в теге ItemTemplate.
мой язык проекта - rtl (персидский), и я хочу установить изображение пользователя справа и ее/ее информацию слева от изображения.
, но это результат:

alt text http://sites.google.com/site/mahdiahmadirad/download-1/2009-12-08_134217.png?attredirects=0&d=1 Проблема с CSS (плавающая) в ListView ItemTemplate!

и вот код для ListView:

<asp:ListView ID="NokListView" runat="server" DataSourceID="ObjectDataSource1"> 
    <LayoutTemplate> 
     <img alt="" src="./img/group.png"><br /> 
     <br /> 
     <fieldset> 
      <legend>ليست کلي</legend> 
      <asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder> 
     </fieldset> 
    </LayoutTemplate> 
    <ItemSeparatorTemplate> 
     <hr /> 
    </ItemSeparatorTemplate> 
    <ItemTemplate> 
     <img style="float: right;" alt="" src='<%# Eval("Gender","./img/{0}.png") %>' /> 
     <span>نام وارث:</span><%# Eval("FirstName") %>&nbsp;<%# Eval("LastName") %><span 
      dir="ltr">(<%# Eval("Email") %>)</span><br /> 
     <span>نسبت او با شما:</span> 
     <%# Eval("Relationship")%><br /> 
    </ItemTemplate> 
</asp:ListView>

Я установил стиль плавать: право, и это работает, но, как вы видите шаблон похож на Иерархический список!
Я хочу, чтобы каждый предмет находился ниже предыдущего элемента НЕ перед. , пожалуйста, объясните мне, что именно происходит ?! и как это исправить?

источник

2009-12-08 mahdiahmadirad

Если вы хотите поместить изображение слева от текста, вы должны использовать float: left. – Phaedrus

извините. Это была моя ошибка. Я исправил это. Я хочу разместить изображение справа и тексты слева. – mahdiahmadirad

В любом случае, просто поместите два отдельных блока контента в отдельные теги div со своими собственными настройками поплавка. Убедитесь, что у вас достаточно полной ширины, установленной в GridView, чтобы разместить это. Также задайте ширины двух разделов контента. Снимок экрана поможет ... – IrishChieftain

Я нашел мой ответ здесь: doctype.com

и полный фиксированный код является:

<ItemSeparatorTemplate> 
<hr style="clear:right;" /> 
</ItemSeparatorTemplate> 
<ItemTemplate> 
    <div style="clear: both;"> 
     <img style="float: right;" alt="" src='<%# Eval("Gender","./img/{0}.png") %>' /> 
     <span>نام وارث:</span><%# Eval("FirstName") %>&nbsp;<%# Eval("LastName") %> 
     <span dir="ltr">(<%# Eval("Email") %>)</span><br /> 
     <span>نسبت او با شما:</span><%# Eval("Relationship")%><br /> 
    </div> 
</ItemTemplate>

Так Посмотрите на результат:

alt text http://sites.google.com/site/mahdiahmadirad/download-1/2009-12-09_103134.png?attredirects=0&d=1

источник

2009-12-09 07:06:02 mahdiahmadirad