files/ru/web/css/padding-right/index.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134

---
title: padding-right
slug: Web/CSS/padding-right
tags:
  - CSS
  - CSS свойство
translation_of: Web/CSS/padding-right
---
<div>{{CSSRef}}</div>

<h2 id="Summary" name="Summary">Summary</h2>

<p><a href="https://developer.mozilla.org/en/CSS" title="CSS">CSS</a> свойство <strong><code>padding-right</code></strong> элемента устанавливает значение поля от правого края элемента. Поля элемента (<a href="https://developer.mozilla.org/en/CSS/box_model#padding" title="http://developer.mozilla.org/en/CSS/Box_model#padding">padding area</a>) это область, расположенная между контентом и границей элемента. Отрицательное значение не валидно.</p>

<p>{{cssinfo}}</p>

<h2 id="Syntax" name="Syntax">Syntax</h2>

<pre class="brush:css">/* &lt;length&gt; значения */
padding-right: 0.5em;
padding-right: 0;
padding-right: 2cm;

/* &lt;percentage&gt; значения */
padding-right: 10%;

/* Общие значения */
padding-right: inherit;
padding-right: initial;
padding-right: unset;
</pre>

<h3 id="Values" name="Values">Values</h3>

<dl>
 <dt>&lt;length&gt;</dt>
 <dd>Устанавливает положительную фиксированную ширину. Подробнее: {{cssxref("&lt;length&gt;")}}.</dd>
 <dt>&lt;percentage&gt;</dt>
 <dd>Процент по отношению к ширине контейнера.</dd>
</dl>

<h3 id="Formal_syntax">Formal syntax</h3>

{{csssyntax}}

<h2 id="Examples" name="Examples">Examples</h2>

<pre class="brush: css">.content { padding-right: 5%; }
.sidebox { padding-right: 10px; }
</pre>

<h2 id="Specifications">Specifications</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{ SpecName('CSS3 Box', '#the-padding', 'padding-right') }}</td>
   <td>{{ Spec2('CSS3 Box') }}</td>
   <td>Без изменений.</td>
  </tr>
  <tr>
   <td>{{ SpecName('CSS3 Transitions', '#animatable-css', 'padding-right') }}</td>
   <td>{{ Spec2('CSS3 Transitions') }}</td>
   <td>Определяет <code>padding-right</code>, как анимируемое свойство.</td>
  </tr>
  <tr>
   <td>{{ SpecName('CSS2.1', 'box.html#padding-properties', 'padding-right') }}</td>
   <td>{{ Spec2('CSS2.1') }}</td>
   <td>Без изменений.</td>
  </tr>
  <tr>
   <td>{{ Specname('CSS1', '#padding-right', 'padding-right') }}</td>
   <td>{{ Spec2('CSS1') }}</td>
   <td>Исходное определение.</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_Compatibility" name="Browser_Compatibility">Browser compatibility</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>1.0</td>
   <td>1.0 (1.0)</td>
   <td>4.0</td>
   <td>3.5</td>
   <td>1.0 (85)</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Phone</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
  </tr>
 </tbody>
</table>
</div>