Wie überschreibt eine CSS-Regel eine andere CSS-Regel?

Das mache ich also:

#id-form td {
padding: 0 0 10px 0;
}

#particular-td {
border: 1px solid black;
text-align: center;
background-color: #DFDFDF;
height: 30px;
padding: 10px;
}

Ich habe einen tisch#id-form, auf die ich alles setzetds zu habenpadding-bottom: 10px.
Aber zu einem besonderen Anlass möchte ich etwas Besonderestd habenpadding: 10px in alle richtungen, die ich in das setze#particular-td.

Natürlich habe ich das CSS-Styling nacheinander in eine externe Datei eingefügt.
Aber das gerenderte CSS hat nurpadding-bottom, undpadding: 10px scheint überschrieben zu sein !?

Bitte erkläre:
Wie und warum passiert das?
Wie sollte ich diese Regeln anordnen, um mein Problem zu lösen (außer beim Inline-Styling)?

EDIT: Ich habe entfernt'table' Vor#id-form in der Tabelle. Ich habe das nie benutzt, ich habe es hier nur erwähnt, um es besser erklären zu können.

Antworten auf die Frage(4)

Ihre Antwort auf die Frage