Çfarë kontrollon vetia display?

Question

Accepted Answer

`display` është një nga vetitë më themelore të CSS — ajo kontrollon **se si një element gjeneron një kutie** dhe se si fëmijët e tij renditen.

```css
.a { display: block; }        /* full width, starts new line (div, p, section) */
.b { display: inline; }       /* flows in text, ignores width/height (span, a) */
.c { display: inline-block; } /* flows inline BUT respects width/height/margins */
.d { display: none; }         /* removed entirely — no space, not rendered */
.e { display: flex; }         /* flex container — 1D layout for children */
.f { display: grid; }         /* grid container — 2D layout for children */
```

## Shfaqja e jashtme vs e brendshme

`display` në fakt vendos dy gjëra: se si kutia sillet **jashtë** (block/inline) dhe se si rregullon **fëmijët** e saj brenda (flow/flex/grid). `display: flex` do të thotë "kjo kutie është në nivel bloku, dhe fëmijët e tij janë artikuj flex."

## display: none vs visibility: hidden

```css
.gone   { display: none; }        /* removed from layout — takes NO space */
.hidden { visibility: hidden; }    /* invisible but STILL occupies its space */
```

Një dallim kyç: `display: none` shemb planin (dhe e fsheh nga lexuesit e ekranit); `visibility: hidden` lë një boshllëk ku ishte elementi. Përdorni `display: none` për të fshirë vërtetë, `visibility: hidden` për të fshehur ndërsa ruani planin.

## Punëtorët kryesorë të planit

```css
.container {
  display: flex;          /* lay children in a row/column (one dimension) */
  gap: 1rem;
}
.grid {
  display: grid;          /* lay children in rows AND columns (two dimensions) */
  grid-template-columns: repeat(3, 1fr);
}
```

Plani modern ndërtohet pothuajse në tërësinë e tij në `flex` (1D — rreshta ose kolona) dhe `grid` (2D — rreshta dhe kolona së bashku).

## Pse ka rëndësi

`display` përcakton të gjithë sjelljen e planit të elementit.

Dija e dalljimit midis block, inline dhe inline-block shpjegon rrjedhën e parazgjedhur; `flex`/`grid` janë bërthama e planit modern; dhe dallimi midis `none` dhe `visibility` është një detaj i testuar shpesh, praktikisht i rëndësishëm.