Sintassi

Significato dei valori principali:

• auto: (default) Il browser determina la direzione del focus in modo automatico.

• none: Disabilita la navigazione verso sinistra da questo elemento.

• selector ID o nome: Specifica l'elemento da focalizzare. Es: nav-left: #elementoSinistra;

• inherit: Eredita il valore dal suo genitore.

⚠️ Nota sul supporto:
Come per le altre proprietà della famiglia nav-*, anche nav-left 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-left

Codice Esempio: nav-left

CODE: CSS

1. .nav-left-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: #80deea;

9.   border: 2px solid #00838f;

10.   border-radius: 8px;

11.   font-size: 18px;

12. }

14. #boxA {

15.   nav-left: #boxC;

16. }

18. #boxB {

19.   nav-left: #boxA;

20. }

22. #boxC {

23.   nav-left: none;

24. }

Contenuto Esempio: nav-left

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

    #boxA {
      nav-left: #boxC;
    }

    #boxB {
      nav-left: #boxA;
    }

    #boxC {
      nav-left: none;
    }
  </style>

  <div id="boxA" class="nav-left-example" tabindex="0">Box A</div>
  <div id="boxB" class="nav-left-example" tabindex="0">Box B</div>
  <div id="boxC" class="nav-left-example" tabindex="0">Box C</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