Sintassi

Significato dei valori principali:

• auto: (valore predefinito) Il browser determina automaticamente il prossimo elemento da focalizzare.

• none: Disattiva la navigazione verso destra da questo elemento.

• selector ID o nome: Specifica un elemento preciso da focalizzare. Esempio: nav-right: #prossimoElemento;

• inherit: Eredita il valore dal genitore.

⚠️ Nota sul supporto:
Come per le altre proprietà della famiglia nav-*, anche nav-right non è supportata nei browser più diffusi (Chrome, Firefox, Safari, Edge). Il comportamento è previsto principalmente per user-agent personalizzati (TV, browser embedded, console).

Esempio proprietà: nav-right

Codice Esempio: nav-right

CODE: CSS

1. .nav-right-example {

2.   width: 150px;

3.   height: 60px;

4.   display: inline-block;

5.   margin: 10px;

6.   text-align: center;

7.   line-height: 60px;

8.   background-color: #d1c4e9;

9.   border: 2px solid #512da8;

10.   border-radius: 8px;

11.   font-size: 18px;

12. }

14. #item1 {

15.   nav-right: #item2;

16. }

18. #item2 {

19.   nav-right: #item3;

20. }

22. #item3 {

23.   nav-right: none;

24. }

Contenuto Esempio: nav-right

  
  <style>
    .nav-right-example {
      width: 150px;
      height: 60px;
      display: inline-block;
      margin: 10px;
      text-align: center;
      line-height: 60px;
      background-color: #d1c4e9;
      border: 2px solid #512da8;
      border-radius: 8px;
      font-size: 18px;
    }

    #item1 {
      nav-right: #item2;
    }

    #item2 {
      nav-right: #item3;
    }

    #item3 {
      nav-right: none;
    }
  </style>

  <div id="item1" class="nav-right-example" tabindex="0">Item 1</div>
  <div id="item2" class="nav-right-example" tabindex="0">Item 2</div>
  <div id="item3" class="nav-right-example" tabindex="0">Item 3</div>
  

Note:
Le indicazioni dei Browser supportati sono superate grazie alla loro costante evoluzione, si consiglia di verificare la compatibilità dei vari browser eseguendo il test cliccando qui sotto.

Supporto Browser