---
url: 'https://dxpr.com/it/hc/documentation/learn-dxpr-builder/layout/nesting'
title: 'Aggiunta di un layout annidato | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-23T23:56:20+00:00'
updated: '2026-10-24T09:09:48+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  Puoi mettere una riga dentro una colonna per dividere di nuovo quella colonna, per esempio due
  icone fianco a fianco sopra un’intestazione. Usalo quando una colonna ha bisogno di una griglia più fine
  della riga intorno. L’esempio aggiunge una riga di due icone alla colonna
  centrale di una riga a tre colonne. Per la tua prima riga, parti da
  Righe e colonne.
tags:
  - Lay-out
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T09:09:48+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Aggiunta di un layout annidato'
      description: |-
        Puoi mettere una riga dentro una colonna per dividere di nuovo quella colonna, per esempio due
        icone fianco a fianco sopra un’intestazione. Usalo quando una colonna ha bisogno di una griglia più fine
        della riga intorno. L’esempio aggiunge una riga di due icone alla colonna
        centrale di una riga a tre colonne. Per la tua prima riga, parti da
        Righe e colonne.
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-23T23:56:20+0000'
      dateModified: '2026-10-24T09:09:48+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/it/hc/documentation/learn-dxpr-builder/layout/nesting'
      articleSection: Lay-out
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/it/hc/documentation/learn-dxpr-builder/layout/nesting'
      description: |-
        Puoi mettere una riga dentro una colonna per dividere di nuovo quella colonna, per esempio due
        icone fianco a fianco sopra un’intestazione. Usalo quando una colonna ha bisogno di una griglia più fine
        della riga intorno. L’esempio aggiunge una riga di due icone alla colonna
        centrale di una riga a tre colonne. Per la tua prima riga, parti da
        Righe e colonne.
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Home
            item: 'https://dxpr.com/it'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: it
---
[Help Center](/it/hc)/[Documentation](/it/hc/documentation) /[Learn DXPR Builder](/hc/documentation/learn-dxpr-builder) /[Build pages](/hc/documentation/learn-dxpr-builder/build) /[Add content](/hc/documentation/learn-dxpr-builder/elements) /[Lay-out](/hc/documentation/learn-dxpr-builder/layout/overview) # Aggiunta di un layout annidato.

 Learn DXPR BuilderBuild pagesAdd contentLay-out

   ## In this guide

 Related guides

- [Aggiunta di un contenitore di livelli posizionati](/it/hc/documentation/learn-dxpr-builder/layout/positioned-layers)
- [Aggiunta di una riga](/it/hc/documentation/learn-dxpr-builder/layout/rows-and-columns)
- [Aggiunta di un pannello a schede](/it/hc/documentation/learn-dxpr-builder/layout/tabs-element)

Puoi mettere una riga dentro una colonna per dividere di nuovo quella colonna, per esempio due icone fianco a fianco sopra un’intestazione. Usalo quando una colonna ha bisogno di una griglia più fine della riga intorno. L’esempio aggiunge una riga di due icone alla colonna centrale di una riga a tre colonne. Per la tua prima riga, parti da [Righe e colonne](/it/hc/documentation/learn-dxpr-builder/layout/rows-and-columns).

## Aggiungi un layout annidato

1. Aggiungi una sezione con una riga e colonne.
2. Passa sopra a una colonna e fai clic su **+** sulla sua barra Column.
3. Nel selettore di elementi scegli **Row** dalla scheda **Layout**.
4. La riga annidata compare dentro la colonna con colonne proprie.
5. Aggiungi elementi alle colonne annidate come al solito, per esempio un’**Icon** in ciascuna.
6. Fai clic su **Save** nella barra degli strumenti per salvare la pagina.

I nuovi elementi arrivano in cima alla loro colonna, quindi la riga annidata sta sopra il testo della colonna.

  ## Cosa vedi

La matita e la stella stanno fianco a fianco in cima alla colonna centrale, sopra l’intestazione Design. Le colonne esterne sono invariate. Nell’editor, la riga annidata ha le sue barre Row e Column, dentro quelle della riga esterna.

```text
Section
  Row (1/3 + 1/3 + 1/3)
    Column
      Text: Discovery
    Column
      Row (nested, 1/2 + 1/2)
        Column
          Icon: pencil
        Column
          Icon: star
      Text: Design
    Column
      Text: Delivery

```

## Configura il tuo layout annidato

Una riga annidata ha la stessa icona griglia e le stesse impostazioni di qualsiasi riga; vedi [Righe e colonne](/it/hc/documentation/learn-dxpr-builder/layout/rows-and-columns). Le sue larghezze sono quote della colonna madre, non della pagina. Una colonna a mezza larghezza che contiene una riga annidata di due metà ti dà due aree da un quarto.

Sugli schermi più stretti di 768 pixel, le colonne annidate si impilano come quelle esterne. Dai alla riga annidata un layout per telefono con **Add screen size** se le icone devono restare fianco a fianco.

### Profondità massima di annidamento

Le righe si annidano fino a tre livelli: una riga, una riga in una delle sue colonne e un’altra riga dentro quella. Un quarto livello è rifiutato. Lo stesso limite vale per ogni tipo di contenitore per conto suo, come Tabs dentro Tabs. Un tipo non conta mai verso il limite di un altro tipo.

Due livelli coprono la maggior parte dei layout. Ogni livello in più aggiunge barre dei controlli da superare e restringe lo spazio per i contenuti.

### Schemi di annidamento comuni

| Schema | Come si costruisce |
|---|---|
| Griglia di funzionalità | Una riga di tre colonne, ciascuna con una riga annidata: un’icona accanto al suo testo |
| Blocchi laterali | Una riga 2/3 + 1/3 la cui colonna stretta contiene righe annidate, una per blocco |
| Membri del team | Una riga di due colonne, ciascuna con una riga annidata 1/3 + 2/3: un ritratto accanto alla bio |

## Se non lo vedi

- **Un avviso dice che puoi annidare le righe solo fino a 3 livelli.** La colonna si trova già dentro due righe annidate, quindi "Element cannot be added". Aggiungi la riga a una colonna di un livello sopra, oppure usa un preset con più colonne sulla riga esterna.
- **La riga annidata sta sopra il testo invece che sotto.** I nuovi elementi arrivano in cima alla loro colonna. Apri **More** sulla barra della riga annidata e scegli **Move Down**.
- **Le icone si impilano sul telefono.** Le colonne annidate si impilano sotto i 768 pixel, come tutte le colonne. Fai clic sull’icona griglia della riga annidata, poi su **Add screen size**, e scegli **1/2 + 1/2** per **Extra small (< 576px)**.

## E adesso?

- [Livelli posizionati](/it/hc/documentation/learn-dxpr-builder/layout/positioned-layers): sovrapponi gli elementi in modi che la griglia non può.
- [Righe e colonne](/it/hc/documentation/learn-dxpr-builder/layout/rows-and-columns): preset di colonna e un layout per dimensione di schermo.
- [Schede](/it/hc/documentation/learn-dxpr-builder/layout/tabs-element): impila pannelli di contenuto in un unico punto invece che fianco a fianco.