Edit letzten tr der Tabelle Subelement

Question

Ich habe eine Tabelle, wo die <ul> von der Seite auf meiner letzten <td> expandiert, versuche ich, <td> durch die Ausrichtung der letzten td meiner Tabelle zu bewegen.

Ich versuche, die letzte TD Ul und die CSS für dieses spezifische Element zu bearbeiten. Ich habe versucht, das Folgende ohne Glück hinzuzufügen.

table td:last-child: .dropdown-menu { 
 
    { 
 
    margin: -121px 0 0 0 !important; 
 
    }

<table class="my-table"> 
 
    <thead> 
 
    <tr> 
 
     <th>1</th> 
 
     <th>2</th> 
 
     <th>3</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>hello</td> 
 
     <td>hello</td> 
 
     <td> 
 
     <span class="dropdown"> 
 
    \t \t \t \t \t <button class="btn btn-default dropdown-toggle btn-xs" type="button" id="menu1" data-toggle="dropdown"> 
 
    \t \t \t \t \t \t Actions <span class="caret"></span> 
 
     </button> 
 
     <ul class="dropdown-menu dropdown-menu-right" style="min-width: 100px"> 
 
      <li><a style="text-decoration: none !important; cursor: pointer;" class="benefitRecipientDelete">Delete</a></li> 
 
      </a> 
 
      </li> 
 
     </ul> 
 
     </span> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td>hello</td> 
 
     <td>hello</td> 
 
     <td> 
 
     <span class="dropdown"> 
 
    \t \t \t \t \t <button class="btn btn-default dropdown-toggle btn-xs" type="button" id="menu1" data-toggle="dropdown"> 
 
    \t \t \t \t \t \t Actions <span class="caret"></span> 
 
     </button> 
 
     <ul class="dropdown-menu dropdown-menu-right" style="min-width: 100px"> 
 
      <li><a style="text-decoration: none !important; cursor: pointer;" class="benefitRecipientDelete">Delete</a></li> 
 
      </a> 
 
      </li> 
 
     </ul> 
 
     </span> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td>hello</td> 
 
     <td>hello</td> 
 
     <td> 
 
     <span class="dropdown"> 
 
    \t \t \t \t \t <button class="btn btn-default dropdown-toggle btn-xs" type="button" id="menu1" data-toggle="dropdown"> 
 
    \t \t \t \t \t \t Actions <span class="caret"></span> 
 
     </button> 
 
     <ul class="dropdown-menu dropdown-menu-right" style="min-width: 100px"> 
 
      <li><a style="text-decoration: none !important; cursor: pointer;" class="benefitRecipientDelete">Delete</a></li> 
 
      </a> 
 
      </li> 
 
     </ul> 
 
     </span> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Wie kann ich die Drop-downmenu/ul des letzten td in meiner Tabelle bearbeiten?

Answer 1

Sie hatten einen Doppelpunkt hinter dem Pseudocode und doppelt öffnenden geschweiften Klammern.

table td:last-child .dropdown-menu { 
 
    margin: -121px 0 0 0; 
 
}

<table class="my-table"> 
 
    <thead> 
 
    <tr> 
 
     <th>1</th> 
 
     <th>2</th> 
 
     <th>3</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>hello</td> 
 
     <td>hello</td> 
 
     <td> 
 
     <span class="dropdown"> 
 
    \t \t \t \t \t <button class="btn btn-default dropdown-toggle btn-xs" type="button" id="menu1" data-toggle="dropdown"> 
 
    \t \t \t \t \t \t Actions <span class="caret"></span> 
 
     </button> 
 
     <ul class="dropdown-menu dropdown-menu-right" style="min-width: 100px"> 
 
      <li><a style="text-decoration: none !important; cursor: pointer;" class="benefitRecipientDelete">Delete</a></li> 
 
     </ul> 
 
     </span> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td>hello</td> 
 
     <td>hello</td> 
 
     <td> 
 
     <span class="dropdown"> 
 
    \t \t \t \t \t <button class="btn btn-default dropdown-toggle btn-xs" type="button" id="menu1" data-toggle="dropdown"> 
 
    \t \t \t \t \t \t Actions <span class="caret"></span> 
 
     </button> 
 
     <ul class="dropdown-menu dropdown-menu-right" style="min-width: 100px"> 
 
      <li><a style="text-decoration: none !important; cursor: pointer;" class="benefitRecipientDelete">Delete</a></li> 
 
     </ul> 
 
     </span> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td>hello</td> 
 
     <td>hello</td> 
 
     <td> 
 
     <span class="dropdown"> 
 
    \t \t \t \t \t <button class="btn btn-default dropdown-toggle btn-xs" type="button" id="menu1" data-toggle="dropdown"> 
 
    \t \t \t \t \t \t Actions <span class="caret"></span> 
 
     </button> 
 
     <ul class="dropdown-menu dropdown-menu-right" style="min-width: 100px"> 
 
      <li><a style="text-decoration: none; cursor: pointer;" class="benefitRecipientDelete">Delete</a></li> 
 
     </ul> 
 
     </span> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>