CSS glossary entries for ‘P’

padding
The padding property is a CSS ‘shorthand property’ which determines the amount of whitespace between the content of an element and the inside edge of its border, or the outside edge of its ‘background’, i.e. it sets the amount of whitespace within a CSS ‘layout box’. It should not normally be used for creating visual space between layout boxes. Use the ‘margin’ property for that.
Padding edge
The padding edge is the outer edge of the padding area in a CSS ‘layout box’. If the box has a border, the padding edge marks the boundary between the padding area and the border. If the box has no borders, but does have margins, the padding edge marks the boundary between the padding area and the margin area.
padding-box
In CSS, the padding-box is the area occupied by a 'layout box's padding. Its outside is bounded by the ‘padding edge’ and its inside by the ‘content edge’. Its size is determined by the CSS ‘padding properties’.
Page furniture
Refers to the non-page-specific components of a web design, i.e. those which are identical, or at least very similar, on most pages of a site. ‘Navbars’, ‘navigation blocks’, headers, banners and footers are typically referred to as ‘page furniture’. Sidebars may or may not be considered page furniture, depending on the extent to which their content varies from page to page. If their content varies little, they will be considered page furniture.
@page size
The @page size property is a CSS3 property which defines the page size for paged media. It is currently unsupported in any web browser. It is, however, available in the Prince XML/HTML to PDF converter.
Parent selector
See ‘subject of selector’
Parentheses
In CSS syntax, a parenthesis is a ‘round bracket’ and is always part of a pair (e.g. ()) denoting the beginning and end of sub-part of a ‘selector’ or a ‘value’.
Past selector
The past selector (E:past) is a CSS4 selector which selects elements that are in the past, on a time-dimensional canvas.
perspective
The perspective property is a CSS3 property which enables 2-D ‘transforms’ to become 3-D transforms by setting the perceived distance between the rendered page's ‘base layer’ and the human user's face, i.e. it creates a ‘sense of perspective’. This property does not actually change the z-index of the selected element. Instead, it merely increases the selected object's size to create the impression of proximity to the user, and decreases the object's size create the impression of greater distance from the user.
position
The position property is a CSS property which specifies which positioning scheme a selected element should adhere to, i.e. which element should be its container and how it should be positioned in relation to that container and in relation to its immediately adjacent siblings in the HTML source code. CSS has four positioning schemes: ‘static positioning’, ‘relative positioning’, ‘fixed positioning’ and ‘absolute positioning’.
position:absolute
Forces the CSS rendering engine to size and position a selected element without regard to its position in normal flow, i.e. on a unique z-axis layer which it does not share with any other element. ‘Absolutely positioned’ elements may be laid out relative to one another and relative to their position in normal flow, by offsets from their nearest non-static ancestor, i.e. their containing block. By default the nearest non-static ancestor, and hence containing block, is the browser viewport. However, absolutely positioned blocks are typically offset from a ‘relatively positioned’ parent, which itself sits in a ‘normal flow’ position.
position:fixed
Forces the CSS rendering engine to size and position a selected element without regard to its position in normal flow, i.e. on a unique z-axis layer which it does not share with any other element. In this respect, it is behaves in exactly the same way as an ‘absolutely positioned’ element. However, unlike absolutely positioned elements, fixed position elements can only be positioned relative to the browser ‘viewport’, i.e. their containing element is always and only the viewport. ‘Fixed positioning’ is, in this sense, a restricted sub-set of ‘absolute positioning’.
Prefix
See ‘experimental prefix’
Property
In CSS, a property specifies what aspect of a selected element's styling should be changed. To become an effective styling instruction, a property needs to be given one or more ‘values’.
Pseudo-class selectors
Are CSS selectors which target an element based on its current state. For example, Pseudo-class selectors may be used to selecting link anchors because they are being hovered over or a form input because it is currently checked. They are called ‘pseudo-class’ selectors, because they allow designers to select groups of elements in much the same way as they would using class names, except that they do not need to add such class names to the HTML source code. Pseudo-classes are a critical requirement for increasing the separation between presentation and markup. They should, therefore, be used in preference to class name selectors whenever it is sensible to do so.
Pseudo-element selectors
Pseudo-element selectors are CSS selectors which select a particular part of an HTML element for the purpose of injecting content into the rendered version of a web page, even though that content does not appear in the HTML source code. This injected content is referred to as a pseudo-element, because it exists in the browser's ‘DOM’ for that page and can be styled or processed in the same way as real elements are. See ‘double colon selectors’ for an explanation of why the same pseudo-selector used a single colon syntax under CSS2 and a double colon syntax under CSS3.

The Web Design Academy Contact us

By form

By Phone

+44 (0)113 234 4611

By email

enquiries@thewebdesign.academy

By snail mail

Suite 3 15 South Parade Leeds LS1 5PQ United Kingdom