Suppression des bordures [sélectionnées] dans un contrôle DetailsView

Question

J'ai un DetailsView control qui comprend plusieurs lignes qui forment une adresse. Idéalement, je voudrais "fusionner" la ligne d'adresse avec les deux lignes suivantes - en supprimant essentiellement les frontières entre eux. Je suppose que je pourrais utiliser un asp: TemplateField pour créer une solution approximative (utiliser une seule ligne, mais les sauts de ligne dans la cellule seconf (data)), mais je préférerais voir s'il y en a d'autres moyens dans le même sens de mon style précédent (en utilisant CssClass). En outre, c'est un exercice d'apprentissage autant que toute autre chose.

J'ai essayé de donner une classe à Address2 BoundField et de supprimer les bordures inférieure et supérieure via CSS, mais cela ne semble pas fonctionner. En regardant le HTML, c'est assigner la classe à une seule cellule, alors que je pense que j'ai besoin d'appliquer cette classe à toute la ligne. Je ne peux aucun moyen d'adresser la rangée entière; Je peux traiter toutes les lignes, soit une colonne, soit une seule cellule.

Des suggestions?

Code Snippets:

HTML:

<h2 class="title">Event Details</h2> 
    <div class="entry"> 
     <form id="frmEvents" runat="server"> 
      <asp:DetailsView ID="vwEventDetails" runat="server" CssClass="vwEventDetails" FieldHeaderStyle-CssClass="FieldCol" > 
       <Fields> 
        <asp:BoundField HeaderText="Event" DataField="EventName" ReadOnly="true" SortExpression="EventName" /> 
        <asp:BoundField HeaderText="Date &amp; Time" DataField="EventDate" ReadOnly="true" SortExpression="EventDate" /> 
        <asp:BoundField HeaderText="Address" DataField="Address1" ReadOnly="true" SortExpression="Address1" /> 
        <asp:BoundField HeaderText="" DataField="Address2" ReadOnly="true" SortExpression="Address2" ItemStyle-CssClass="noBorders" /> 
        <asp:BoundField HeaderText="" DataField="Address3" ReadOnly="true" SortExpression="Address3" /> 
        <asp:BoundField HeaderText="Town" DataField="Town" ReadOnly="true" SortExpression="Town" /> 
        <asp:BoundField HeaderText="County" DataField="County" ReadOnly="true" SortExpression="County" /> 
        <asp:BoundField HeaderText="Postcode" DataField="Postcode" ReadOnly="true" SortExpression="Postcode" /> 
        <asp:BoundField HeaderText="Entry Fee" DataField="EventFee" ReadOnly="true" SortExpression="EntryFee" /> 
        <asp:BoundField HeaderText="Sponsor" DataField="SponsorName" ReadOnly="true" SortExpression="Sponsor" /> 
        <asp:BoundField HeaderText="Category" DataField="CategoryName" ReadOnly="true" SortExpression="Category" /> 
        <asp:HyperLinkField HeaderText="" DataTextField="" Text="Make A Booking" DataNavigateUrlFields="EventID" DataNavigateUrlFormatString="bookevent.aspx?eventid={0}" /> 
       </Fields> 
      </asp:DetailsView> 
     </form> 
    </div> 

CSS:

.vwEventDetails .FieldCol 
{ 
    font-weight: bold; 
    background-color: #99CCFF; 
    width: 100px; 
} 

.vwEventDetails tr td 
{ 
    padding: 0 2em; 
} 

.noBorders 
{ 
    border-bottom-style:none; 
    border-top-style:none; 
} 

Answer 1

Je voudrais utiliser 2 styles:

.noTopBorders { border-top: none; } 
.noBottomBorders { border-bottom: none; } 

J'assignerais noTopBorders au HeaderStyle-CssClass et les propriétés ItemStyle-CssClass des champs de délimitation "Address2" et "Address3". J'affecterais noBottomBorders aux propriétés HeaderStyle-CssClass et ItemStyle-CssClass des champs liés "Address1" et "Address2".