C'è qualche ragione per cui non è possibile mettere un bordo attorno a un <tr> in una tabella html usando i CSS

Question

Ho una tabella e ho un tr con una classe impostata su "underRow".

In CSS che ho:

.underRow { 
border-bottom-color: #7a26b9; 
border-bottom-style: solid; 
border-bottom-width: 1px; 
} 

ma il bordo della riga non sembra stia cambiando a tutti. Se sposto l'attributo di classe in td, funziona bene (ma il problema è che ottengo uno spazio nel mezzo in cui il padding si trova tra le celle.) Voglio evitare questo spazio e avere una linea retta sotto la riga

qualcosa che non va con la messa bordo attributi CSS su un elemento di riga (tr)

Ecco il resto del CSS su questo tavolo per riferimento:?

.quantityTable { 
    border-radius: 5px 5px 5px 5px; 
    background-color: #d6b4E1; 
    padding: 5px; 
    margin-bottom: 5px; 
    width: 100%; 
    border-width: 2px; 
    border-color: #7a26b9; 
    border-style: solid; 
} 

Answer 1

No, dovrebbe funzionare.

vedere questo: http://jsfiddle.net/jasongennaro/qCzrg/

forse avete bisogno di crollare tuoi confini con

border-collapse:collapse 

O forse altri stili per la TD è prevalente

si può mostrare un po 'di codice.

Come per la tua modifica:

(ma il problema è che ottengo uno spazio in mezzo dove l'imbottitura è tra le celle voglio evitare questo spazio e avere una retta . riga sotto la riga.

Suona come è sicuramente bisogno border-collapse

si dovrebbe aggiungere che lo stile di il table.

Ecco un po 'più su di esso: http://www.the-art-of-web.com/css/bordercollapse/

EDIT 2

Sulla base del nuovo codice e il seguente commento:

il problema è che se io uso: border- collapse: collasso, quindi lo stile del raggio di confine non funziona più

Ti sto indovinando desidera qualcosa di simile

.quantityTable{ 
    border-radius: 15px 15px 15px 15px; 
    background-color: #d6b4E1; 
    margin-bottom: 5px; 
    width: 100%;  
} 

.underRow{ 
    border-bottom-color: #7a26b9; 
    border-bottom-style: solid; 
    border-bottom-width: 1px; 
} 

.underRow:last-child{ 
    border-bottom:none; 
} 

.underRow td{ 
    padding: 15px; 
} 

Esempio: http://jsfiddle.net/jasongennaro/qCzrg/1/

NOTA

1. ho fatto il raggio in modo più grande si poteva vedere più facile.

2. Ho anche rimosso il confine dalla tabella stessa

Answer 2

alcune versioni di alcuni browser don Prendiamo gentilmente a impostare gli stili dei bordi sugli elementi tr.

Puoi sempre impostarli sul loro td s invece.

.underRow td { 
    border-bottom: 1px solid #7a26b9; 
} 

Se c'è confine spaziatura potrebbe essere necessario comprimere i tuoi confini tabella utilizzando border-collapse: collapse;.