7 replies [Last post]
sweetNet
sweetNet's picture
Offline
newbie
Last seen: 2 years 37 weeks ago
Timezone: GMT-5
Joined: 2012-01-17
Posts: 8
Points: 10

Hi, I am observing an interesting outcome of IE parsing HTML bellow. Puzzled The page is using a .NET server control Repeater that has an ItemTemplete set for each item iterated. Each item has two main elements - a

and a
  • . In Firefox this is correctly rendered but in IE only the first repeater item has both the
    and
  • on the same level. All sunsequent
      or Repeater items have one parent
    • and the
      becomes a child of the corresponding
    • . As such the page looks very different. Thank you for your ideas.
  • <ul id="leftList"> 
                      <asp:Repeater ID="rptLatestListingsLeft" runat="server" OnItemDataBound="rptLatestListingsLeft_OnItemDataBound">
                        <ItemTemplate>
                        <div id="divMapPinLeft">
                        <asp:Label runat="server" ID="lblMapPinIndexLeft"></asp:Label>
                       </div>
                         <li id='<%# String.Format("liBusiness{0}", Eval("BusinessID")) %>' style="padding-bottom: 30px">
                              <asp:HyperLink ID="lnkBusiness" runat="server">
                                                <%# Eval("BusinessName")%>
                                            </asp:HyperLink>
     
                            <div class="divAddressLeft"><%# Eval("City")%>, <%# Eval("ProvinceCode")%></div>
                            <div id="divStatusLeft"><%# GetStatus(Eval("BusinessID"))%> | <span class="statusTag"><%# GetDay(Eval("UpdateDate"))%></span></div>
                         </li>
                        </ItemTemplate>
                       </asp:Repeater>                    
               </ul> 

    sweetNet
    sweetNet's picture
    Offline
    newbie
    Last seen: 2 years 37 weeks ago
    Timezone: GMT-5
    Joined: 2012-01-17
    Posts: 8
    Points: 10

    question correction

    sweetNet wrote:
    Hi, I am observing an interesting outcome of IE parsing HTML bellow. Puzzled The page is using a .NET server control Repeater that has an ItemTemplete set for each item iterated. Each item has two main elements - a div and a li . In Firefox this is correctly rendered but in IE only the first repeater item has both the div and li on the same level. All subsequent ul/Repeater items have one parent li and the div becomes its child, for some reason. As such the page looks very different. Thank you for your ideas.

    sweetNet
    sweetNet's picture
    Offline
    newbie
    Last seen: 2 years 37 weeks ago
    Timezone: GMT-5
    Joined: 2012-01-17
    Posts: 8
    Points: 10

    sweetNet wrote: Hi, I am

    sweetNet wrote:

    Hi, I am observing an interesting outcome of IE parsing HTML bellow. Puzzled The page is using a .NET server control Repeater that has an ItemTemplete set for each item iterated. Each item has two main elements - a

    and a li . In Firefox this is correctly rendered but in IE only the first repeater item has both the div and li on the same level. All sunsequent ul or Repeater items have one parent
  • and the
    becomes a child of the corresponding li. As such the page looks very different. Thank you for your ideas.
  • <ul id="leftList"> 
                      <asp:Repeater ID="rptLatestListingsLeft" runat="server" OnItemDataBound="rptLatestListingsLeft_OnItemDataBound">
                        <ItemTemplate>
                        <div id="divMapPinLeft">
                        <asp:Label runat="server" ID="lblMapPinIndexLeft"></asp:Label>
                       </div>
                         <li id='<%# String.Format("liBusiness{0}", Eval("BusinessID")) %>' style="padding-bottom: 30px">
                              <asp:HyperLink ID="lnkBusiness" runat="server">
                                                <%# Eval("BusinessName")%>
                                            </asp:HyperLink>
     
                            <div class="divAddressLeft"><%# Eval("City")%>, <%# Eval("ProvinceCode")%></div>
                            <div id="divStatusLeft"><%# GetStatus(Eval("BusinessID"))%> | <span class="statusTag"><%# GetDay(Eval("UpdateDate"))%></span></div>
                         </li>
                        </ItemTemplate>
                       </asp:Repeater>                    
               </ul> 

    sweetNet
    sweetNet's picture
    Offline
    newbie
    Last seen: 2 years 37 weeks ago
    Timezone: GMT-5
    Joined: 2012-01-17
    Posts: 8
    Points: 10

    sweetNet wrote:Hi, I am

    sweetNet wrote:

    Hi, I am observing an interesting outcome of IE parsing HTML bellow. Puzzled The page is using a .NET server control Repeater that has an ItemTemplete set for each item iterated. Each item has two main elements - a div and a li. In Firefox this is correctly rendered but in IE only the first repeater item has both the div and li on the same level. All sunsequent ul or Repeater items have one parent li and the div becomes a child of the corresponding li. As such the page looks very different. Thank you for your ideas.

    <ul id="leftList"> 
                      <asp:Repeater ID="rptLatestListingsLeft" runat="server" OnItemDataBound="rptLatestListingsLeft_OnItemDataBound">
                        <ItemTemplate>
                        <div id="divMapPinLeft">
                        <asp:Label runat="server" ID="lblMapPinIndexLeft"></asp:Label>
                       </div>
                         <li id='<%# String.Format("liBusiness{0}", Eval("BusinessID")) %>' style="padding-bottom: 30px">
                              <asp:HyperLink ID="lnkBusiness" runat="server">
                                                <%# Eval("BusinessName")%>
                                            </asp:HyperLink>
     
                            <div class="divAddressLeft"><%# Eval("City")%>, <%# Eval("ProvinceCode")%></div>
                            <div id="divStatusLeft"><%# GetStatus(Eval("BusinessID"))%> | <span class="statusTag"><%# GetDay(Eval("UpdateDate"))%></span></div>
                         </li>
                        </ItemTemplate>
                       </asp:Repeater>                    
               </ul> 

    sweetNet
    sweetNet's picture
    Offline
    newbie
    Last seen: 2 years 37 weeks ago
    Timezone: GMT-5
    Joined: 2012-01-17
    Posts: 8
    Points: 10

    got it to work

    I got it to work by placing the div insie li element. Thank you.

    Hugo
    Hugo's picture
    Offline
    Moderator
    London
    Last seen: 1 week 2 days ago
    London
    Timezone: GMT+1
    Joined: 2004-06-06
    Posts: 15664
    Points: 2802

    Div inside the li element

    Div inside the li element would help otherwise you would have malformed markup, a ul may not have any element as a first child that is not a li element, put what you like inside those li elements though. It's important to have a good understanding of the frontend tier of development markup after all is the vehicle that carries the server side processing to the browser and needs to be written well in order that the browser may render things accurately.

    When posting code to the forum please post browser side code only, we are a serverside agnostic forum only concerned with frontend results and issues so <ItemTemplate> is meaningless to me I see it as a html tag that doesn't exist, or perhaps we've extended the doc schema?

    When you do post please post all the code markup so we can see the complete picture rather than isolated snippets and if the issue is styling related the corresponding style rules.

    You seem t have had a great deal of trouble posting Smile if you want to add markup to the body of the post use either code tags in square brackets or for small snippets you can escape the angle braket to prevent it being parsed e.g. & lt ; (without spaces)

    Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
    ----------------------------------------------------------------
    Please post ALL your code - both CSS & HTML - in [code] tags
    Please validate and ensure you have included a full Doctype before posting.
    Why validate? Read Me

    tan106
    tan106's picture
    Offline
    newbie
    Last seen: 2 years 36 weeks ago
    Timezone: GMT+8
    Joined: 2012-02-18
    Posts: 5
    Points: 5

    Thank you~~~~

    Thank you~~~~

    Hugo
    Hugo's picture
    Offline
    Moderator
    London
    Last seen: 1 week 2 days ago
    London
    Timezone: GMT+1
    Joined: 2004-06-06
    Posts: 15664
    Points: 2802

    For what?

    For what?
    Ah based on your conduct to date and warnings given and ignored, your account is now suspended.

    Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
    ----------------------------------------------------------------
    Please post ALL your code - both CSS & HTML - in [code] tags
    Please validate and ensure you have included a full Doctype before posting.
    Why validate? Read Me