From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/ca/web/css/margin-left/index.html | 219 ++++++++++++++++++++++++++++++++ 1 file changed, 219 insertions(+) create mode 100644 files/ca/web/css/margin-left/index.html (limited to 'files/ca/web/css/margin-left') diff --git a/files/ca/web/css/margin-left/index.html b/files/ca/web/css/margin-left/index.html new file mode 100644 index 0000000000..388c6f9a4c --- /dev/null +++ b/files/ca/web/css/margin-left/index.html @@ -0,0 +1,219 @@ +--- +title: margin-left +slug: Web/CSS/margin-left +tags: + - CSS + - CSS Property + - Layout + - Reference +translation_of: Web/CSS/margin-left +--- +
{{CSSRef()}}
+ +

La propietat CSS margin-left estableix l'àrea de marge en el costat esquerre d'un element. Un valor positiu el situarà més enllà del normal dels seus veïns, mentre que un valor negatiu el situarà més a prop.

+ +
/* <length> values */
+margin-left: 10px;  /* An absolute length */
+margin-left: 1em;   /* relative to the text size */
+margin-left: 5%;    /* relative to the nearest block container's width */
+
+/* Keyword values */
+margin-left: auto;
+
+/* Global values */
+margin-left: inherit;
+margin-left: initial;
+margin-left: unset;
+
+ +

Area on which CSS margin-left apply

+ +

Els marges verticals de dues caixes adjacents es poden fusionar. Això es diu col.lapse de marge.

+ +

En els casos excepcionals en què l'amplada està massa restringida (és a dir, quan es defineixen tots els width, margin-left, border, padding, l'àrea de contingut i margin-right), s'ignora el margin-left i tindrà el mateix valor calculat que si s'especifica el valor auto.

+ +

{{cssinfo}}

+ +

Sintaxi

+ +

La propietat margin-left és especificada amb la paraula clau auto, o un <length>, o un <percentage>. El seu valor pot ser positiu, zero o negatiu.

+ +

Valors

+ +
+
{{cssxref("<length>")}}
+
La grandària del marge com a valor fix.
+
{{cssxref("<percentage>")}}
+
La grandària del marge com a percentatge, en relació amb l'amplada del bloc contenidor.
+
auto
+
El marge esquerre rep una part de l'espai horitzontal no utilitzat, tal com es determina principalment pel mode de disseny que s'utilitza. Si els valors de margin-left i margin-right són auto, l'espai calculat es distribueix de manera uniforme. Aquesta taula resumeix els diferents casos: + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Valor de {{cssxref("display")}}Valor de {{cssxref("float")}}Valor de {{cssxref("position")}}Valor calculat d'autoComment
inline, inline-block, inline-tablequalsevolstatic o relative0Mode de disseny en línia
block, inline, inline-block, block, table, inline-table, list-item, table-captionqualsevolstatic o relative0, excepte si tant margin-left i margin-right s'estableixen en auto. En aquest cas, s'estableix el valor que centra l'element dins del seu pare.Mode de disseny de block
block, inline, inline-block, block, table, inline-table, list-item, table-captionleft o rightstatic o relative0Mode de disseny de block (element flotant)
qualsevol table-*, excepte table-captionqualsevolqualsevol0Els elements interns de table-* no tenen marges, utilitzeu {{ cssxref("border-spacing") }} en el seu lloc
qualsevol, excepte flex, inline-flex, o table-*qualsevolfixed o absolute0, excepte si tant margin-left i margin-right s'estableixen en auto. En aquest cas, s'estableix el valor que centra l'àrea de vora dins de width disponible, si es fixa.Mode de disseny absolutament posicionat
flex, inline-flexqualsevolqualsevol0, excepte si hi ha algun espai lliure horitzontal positiu. En aquest cas, es distribueix uniformement a tots els marges auto horitzontals.Mode de disseny Flexbox
+
+
+ +

Sintaxi formal

+ +
{{csssyntax()}}
+ +

Exemples

+ +
.content { margin-left: 5%; }
+.sidebox { margin-left: 10px; }
+.logo    { margin-left: -5px; }
+
+ +

Especificacions

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
EspecificacióEstatComentari
{{SpecName('CSS3 Box', '#the-margin', 'margin-left')}}{{Spec2('CSS3 Box')}}No hi ha cap canvi significatiu des de CSS 2.1.
{{SpecName('CSS3 Transitions', '#animatable-css', 'margin-left')}}{{Spec2('CSS3 Transitions')}}Defineix margin-left com animable.
{{SpecName('CSS3 Flexbox', '#item-margins', 'margin-left')}}{{Spec2('CSS3 Flexbox')}}Defineix el comportament de margin-left en elements flex.
{{SpecName('CSS2.1', 'box.html#margin-properties', 'margin-left')}}{{Spec2('CSS2.1')}}Igual que a CSS1, però elimina el seu efecte en els elements en línia
{{SpecName('CSS1', '#margin-left', 'margin-left')}}{{Spec2('CSS1')}}Definició inicial.
+ +

Navegadors compatibles

+ +

{{CompatibilityTable()}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
DescripcióChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Suport bàsic1.0{{CompatVersionUnknown}}{{CompatGeckoDesktop("1")}}3.03.51.0 (85)
auto value1.0{{CompatVersionUnknown}}{{CompatGeckoDesktop("1")}}6.0 (strict mode)3.51.0 (85)
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
DescripcióAndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Suport bàsic1.0{{CompatVersionUnknown}}{{CompatGeckoMobile("1")}}6.06.01.0
+
-- cgit v1.2.3-54-g00ecf