CARVIEW |
Select Language
HTTP/2 200
date: Tue, 22 Jul 2025 08:22:41 GMT
content-type: text/html; charset=utf-8
vary: X-PJAX, X-PJAX-Container, Turbo-Visit, Turbo-Frame, X-Requested-With,Accept-Encoding, Accept, X-Requested-With
etag: W/"d32c572f4fc840490ea9b927b3a0a68c"
cache-control: max-age=0, private, must-revalidate
strict-transport-security: max-age=31536000; includeSubdomains; preload
x-frame-options: deny
x-content-type-options: nosniff
x-xss-protection: 0
referrer-policy: no-referrer-when-downgrade
content-security-policy: default-src 'none'; base-uri 'self'; child-src github.githubassets.com github.com/assets-cdn/worker/ github.com/assets/ gist.github.com/assets-cdn/worker/; connect-src 'self' uploads.github.com www.githubstatus.com collector.github.com raw.githubusercontent.com api.github.com github-cloud.s3.amazonaws.com github-production-repository-file-5c1aeb.s3.amazonaws.com github-production-upload-manifest-file-7fdce7.s3.amazonaws.com github-production-user-asset-6210df.s3.amazonaws.com *.rel.tunnels.api.visualstudio.com wss://*.rel.tunnels.api.visualstudio.com objects-origin.githubusercontent.com copilot-proxy.githubusercontent.com proxy.individual.githubcopilot.com proxy.business.githubcopilot.com proxy.enterprise.githubcopilot.com *.actions.githubusercontent.com wss://*.actions.githubusercontent.com productionresultssa0.blob.core.windows.net/ productionresultssa1.blob.core.windows.net/ productionresultssa2.blob.core.windows.net/ productionresultssa3.blob.core.windows.net/ productionresultssa4.blob.core.windows.net/ productionresultssa5.blob.core.windows.net/ productionresultssa6.blob.core.windows.net/ productionresultssa7.blob.core.windows.net/ productionresultssa8.blob.core.windows.net/ productionresultssa9.blob.core.windows.net/ productionresultssa10.blob.core.windows.net/ productionresultssa11.blob.core.windows.net/ productionresultssa12.blob.core.windows.net/ productionresultssa13.blob.core.windows.net/ productionresultssa14.blob.core.windows.net/ productionresultssa15.blob.core.windows.net/ productionresultssa16.blob.core.windows.net/ productionresultssa17.blob.core.windows.net/ productionresultssa18.blob.core.windows.net/ productionresultssa19.blob.core.windows.net/ github-production-repository-image-32fea6.s3.amazonaws.com github-production-release-asset-2e65be.s3.amazonaws.com insights.github.com wss://alive.github.com api.githubcopilot.com api.individual.githubcopilot.com api.business.githubcopilot.com api.enterprise.githubcopilot.com; font-src github.githubassets.com; form-action 'self' github.com gist.github.com copilot-workspace.githubnext.com objects-origin.githubusercontent.com; frame-ancestors 'none'; frame-src viewscreen.githubusercontent.com notebooks.githubusercontent.com; img-src 'self' data: blob: github.githubassets.com media.githubusercontent.com camo.githubusercontent.com identicons.github.com avatars.githubusercontent.com private-avatars.githubusercontent.com github-cloud.s3.amazonaws.com objects.githubusercontent.com release-assets.githubusercontent.com secured-user-images.githubusercontent.com/ user-images.githubusercontent.com/ private-user-images.githubusercontent.com opengraph.githubassets.com copilotprodattachments.blob.core.windows.net/github-production-copilot-attachments/ github-production-user-asset-6210df.s3.amazonaws.com customer-stories-feed.github.com spotlights-feed.github.com objects-origin.githubusercontent.com *.githubusercontent.com; manifest-src 'self'; media-src github.com user-images.githubusercontent.com/ secured-user-images.githubusercontent.com/ private-user-images.githubusercontent.com github-production-user-asset-6210df.s3.amazonaws.com gist.github.com; script-src github.githubassets.com; style-src 'unsafe-inline' github.githubassets.com; upgrade-insecure-requests; worker-src github.githubassets.com github.com/assets-cdn/worker/ github.com/assets/ gist.github.com/assets-cdn/worker/
server: github.com
content-encoding: gzip
accept-ranges: bytes
set-cookie: _gh_sess=BuqEZoRH7SLXx7ouA3XSuTd90j9al5Itpgk77ciEAkDf2X6SRCXfpC6rA2dOHlEKHEwSPOVaXqp%2BTsDxqrBE3Tsmfn%2B9QA%2Bq9ey%2B47W9uAUJ13bKEVuOK4bBAYZk8xebVTJBNO0c5IppH2YHunACQu6NE2XHkVjzu1%2BJk5H9BKWWkhezeemeXScsVMzS8mjUnFJnIHtrVVAIvYnN8VC9vT%2Fz6J37jj6HAhM4q2w8DBUS27Eb9AtNGv5CvN%2BNzehUJFLOiuSz2sn3h2WmCrxh%2Bg%3D%3D--hkaEk7YPTbSP5az2--6AYpeVUZUuv9vndHaxirfw%3D%3D; Path=/; HttpOnly; Secure; SameSite=Lax
set-cookie: _octo=GH1.1.1835904290.1753172561; Path=/; Domain=github.com; Expires=Wed, 22 Jul 2026 08:22:41 GMT; Secure; SameSite=Lax
set-cookie: logged_in=no; Path=/; Domain=github.com; Expires=Wed, 22 Jul 2026 08:22:41 GMT; HttpOnly; Secure; SameSite=Lax
x-github-request-id: D01C:2091F5:35E793:3C2E63:687F4A51
Layout and Flex Specifications · IgniteUI/igniteui-angular Wiki · GitHub
Skip to content
Navigation Menu
{{ message }}
-
Notifications
You must be signed in to change notification settings - Fork 160
Layout and Flex Specifications
Stanimir Dimitrov edited this page May 12, 2017
·
1 revision
igxLayout
directive should be used to arrange elements, organize screen content and add/improve the structure of overlay elements.
Use the igxLayout
directive on a container element to specify the layout direction for its children: horizontally with igxLayoutDir="row" or vertically with igxLayoutDir="column". The igxLayout directive affects the flow directions for that container's immediate children.
As a developer I want to be able to provide a way to adapt to any possible screen size easily and manage content reflows on different screens.
<span igxLayout >
...
</span>
The igxLayout
should provide a way to visualize different contents on a screen/page.
- Manage flow direction.
- Operate with flex children.
- Define different alignments.
- Mange how children are laid out.
-
igxLayoutDir
- Sets the default flow direction of the container's children. Defaults torows
. -
igxLayoutReverse
- Defines the direction flex children are placed in the flex container. When set totrue
, therows
direction goes right to left andcolumns
goes bottom to top. -
igxLayoutWrap
- By default the immediate children will all try to fit onto one line. The default valuenowrap
sets this behavior. Other accepted values arewrap
andwrap-reverse
. -
igxLayoutJustify
- Defines the alignment along the main axis. Defaults toflex-start
which packs the children toward the start line. Other possible values areflex-end
,center
,space-between
,space-around
. -
igxLayoutItemAlign
- Defines the default behavior for how children are laid out along the corss axis of the current line. Defaults toflex-start
. Other possible values areflex-end
,center
,baseline
, andstretch
.
It is used for elements inside an igxLayout
parent to control specific flexbox properties.
-
igxFlexOrder
- Controls in what order are the elements laid out in the flex container. Defaults to0
. -
igxFlexGrow
- Sets whether an item should grow in a propotion to its peers inside the flex container. Defaults to1
. -
igxFlexShrink
- Sets whether an items should shrink in a propotion to its peers. Defaults to1
and negative number are not accepted.
You can’t perform that action at this time.