Lightning Grid - Columns and Rows? The 2019 Stack Overflow Developer Survey Results Are...
What tool would a Roman-age civilization have for the breaking of silver and other metals into dust?
Can a rogue use sneak attack with weapons that have the thrown property even if they are not thrown?
Is "plugging out" electronic devices an American expression?
Where to refill my bottle in India?
Why can Shazam fly?
Can we generate random numbers using irrational numbers like π and e?
Loose spokes after only a few rides
Delete all lines which don't have n characters before delimiter
Button changing it's text & action. Good or terrible?
Return to UK after being refused entry years previously
Are there incongruent pythagorean triangles with the same perimeter and same area?
Can one be advised by a professor who is very far away?
Why was M87 targetted for the Event Horizon Telescope instead of Sagittarius A*?
Origin of "cooter" meaning "vagina"
Is a "Democratic" Oligarchy-Style System Possible?
Is three citations per paragraph excessive for undergraduate research paper?
Do these rules for Critical Successes and Critical Failures seem Fair?
How to manage monthly salary
Worn-tile Scrabble
Time travel alters history but people keep saying nothing's changed
Should I use my personal e-mail address, or my workplace one, when registering to external websites for work purposes?
One word riddle: Vowel in the middle
Why do UK politicians seemingly ignore opinion polls on Brexit?
Write faster on AT24C32
Lightning Grid - Columns and Rows?
The 2019 Stack Overflow Developer Survey Results Are InDynamically add and remove rows in lightningLightning data grid break pointsLightning Component - Grid Sizing - Narrow (right) side of Lightning pageLightning is showing unnecessary blue border around slds-grid elementsAligning table rows and columns in two different componentsDisable Checkbox for Parent rows in Lightning Tree GridSLDS Grid Columns Not the Same WidthInvoke Object Quick Action from Enhanced Lightning GridSyntax for Filter on enhanced lighning gridSpace between columns in a grid - not symmetric
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ margin-bottom:0;
}
Looking to create this type of Grid in Lightning Grid. However what currently happens is C and D get pushed below item B (which is a chatter feed so it is long)
Current Component (mine is more set up with C/D switched with A, but i think the concept remains the same)
<aura:component implements="lightning:homeTemplate"
description="A home page you always dreamed of, 3 columns." >
<aura:attribute name="column1" type="Aura.Component[]" />
<aura:attribute name="column2" type="Aura.Component[]" />
<aura:attribute name="column3" type="Aura.Component[]" />
<aura:attribute name="column4" type="Aura.Component[]" />
<div>
<lightning:layout horizontalAlign="spread" pullToBoundary="small"
multipleRows="true">
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column1}
</lightning:layoutItem>
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column2}
</lightning:layoutItem>
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column3}
</lightning:layoutItem>
</lightning:layout>
<lightning:layoutItem size="8" flexibility="grow"
padding="around-small">
{!v.column4}
</lightning:layoutItem>
</div>
</aura:component>
Any ideas on how to create this with Lightning Grid?
lightning-aura-components lightning page-layout enhanced-lightning-grid
asked 2 hours ago
BobbygllhBobbygllh
387
add a comment |
Looking to create this type of Grid in Lightning Grid. However what currently happens is C and D get pushed below item B (which is a chatter feed so it is long)
Current Component (mine is more set up with C/D switched with A, but i think the concept remains the same)
<aura:component implements="lightning:homeTemplate"
description="A home page you always dreamed of, 3 columns." >
<aura:attribute name="column1" type="Aura.Component[]" />
<aura:attribute name="column2" type="Aura.Component[]" />
<aura:attribute name="column3" type="Aura.Component[]" />
<aura:attribute name="column4" type="Aura.Component[]" />
<div>
<lightning:layout horizontalAlign="spread" pullToBoundary="small"
multipleRows="true">
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column1}
</lightning:layoutItem>
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column2}
</lightning:layoutItem>
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column3}
</lightning:layoutItem>
</lightning:layout>
<lightning:layoutItem size="8" flexibility="grow"
padding="around-small">
{!v.column4}
</lightning:layoutItem>
</div>
</aura:component>
Any ideas on how to create this with Lightning Grid?
lightning-aura-components lightning page-layout enhanced-lightning-grid
asked 2 hours ago
BobbygllhBobbygllh
387
add a comment |
Looking to create this type of Grid in Lightning Grid. However what currently happens is C and D get pushed below item B (which is a chatter feed so it is long)
Current Component (mine is more set up with C/D switched with A, but i think the concept remains the same)
<aura:component implements="lightning:homeTemplate"
description="A home page you always dreamed of, 3 columns." >
<aura:attribute name="column1" type="Aura.Component[]" />
<aura:attribute name="column2" type="Aura.Component[]" />
<aura:attribute name="column3" type="Aura.Component[]" />
<aura:attribute name="column4" type="Aura.Component[]" />
<div>
<lightning:layout horizontalAlign="spread" pullToBoundary="small"
multipleRows="true">
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column1}
</lightning:layoutItem>
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column2}
</lightning:layoutItem>
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column3}
</lightning:layoutItem>
</lightning:layout>
<lightning:layoutItem size="8" flexibility="grow"
padding="around-small">
{!v.column4}
</lightning:layoutItem>
</div>
</aura:component>
Any ideas on how to create this with Lightning Grid?
lightning-aura-components lightning page-layout enhanced-lightning-grid
asked 2 hours ago
BobbygllhBobbygllh
387
Looking to create this type of Grid in Lightning Grid. However what currently happens is C and D get pushed below item B (which is a chatter feed so it is long)
Current Component (mine is more set up with C/D switched with A, but i think the concept remains the same)
<aura:component implements="lightning:homeTemplate"
description="A home page you always dreamed of, 3 columns." >
<aura:attribute name="column1" type="Aura.Component[]" />
<aura:attribute name="column2" type="Aura.Component[]" />
<aura:attribute name="column3" type="Aura.Component[]" />
<aura:attribute name="column4" type="Aura.Component[]" />
<div>
<lightning:layout horizontalAlign="spread" pullToBoundary="small"
multipleRows="true">
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column1}
</lightning:layoutItem>
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column2}
</lightning:layoutItem>
<lightning:layoutItem size="4" flexibility="grow"
padding="around-small">
{!v.column3}
</lightning:layoutItem>
</lightning:layout>
<lightning:layoutItem size="8" flexibility="grow"
padding="around-small">
{!v.column4}
</lightning:layoutItem>
</div>
</aura:component>
Any ideas on how to create this with Lightning Grid?
lightning-aura-components lightning page-layout enhanced-lightning-grid
lightning-aura-components lightning page-layout enhanced-lightning-grid
asked 2 hours ago
BobbygllhBobbygllh
387
asked 2 hours ago
BobbygllhBobbygllh
387
asked 2 hours ago
BobbygllhBobbygllh
387
asked 2 hours ago
BobbygllhBobbygllh
387
asked 2 hours ago
BobbygllhBobbygllh
387
387
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
SLDS doesn't have a provision for multi-row cells. However, you can do this with a combination of nested grids:
<aura:application extends="force:slds">
<lightning:layout>
<lightning:layoutItem size="8">
<lightning:layout multipleRows="true">
<lightning:layoutItem size="12">
Section A
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section C
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section D
</lightning:layoutItem>
</lightning:layout>
</lightning:layoutItem>
<lightning:layoutItem size="4">
Section B
</lightning:layoutItem>
</lightning:layout>
</aura:application>
answered 2 hours ago
sfdcfoxsfdcfox
264k13210457
add a comment |
Your Answer
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "459"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fsalesforce.stackexchange.com%2fquestions%2f257408%2flightning-grid-columns-and-rows%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
SLDS doesn't have a provision for multi-row cells. However, you can do this with a combination of nested grids:
<aura:application extends="force:slds">
<lightning:layout>
<lightning:layoutItem size="8">
<lightning:layout multipleRows="true">
<lightning:layoutItem size="12">
Section A
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section C
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section D
</lightning:layoutItem>
</lightning:layout>
</lightning:layoutItem>
<lightning:layoutItem size="4">
Section B
</lightning:layoutItem>
</lightning:layout>
</aura:application>
answered 2 hours ago
sfdcfoxsfdcfox
264k13210457
add a comment |
SLDS doesn't have a provision for multi-row cells. However, you can do this with a combination of nested grids:
<aura:application extends="force:slds">
<lightning:layout>
<lightning:layoutItem size="8">
<lightning:layout multipleRows="true">
<lightning:layoutItem size="12">
Section A
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section C
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section D
</lightning:layoutItem>
</lightning:layout>
</lightning:layoutItem>
<lightning:layoutItem size="4">
Section B
</lightning:layoutItem>
</lightning:layout>
</aura:application>
answered 2 hours ago
sfdcfoxsfdcfox
264k13210457
add a comment |
SLDS doesn't have a provision for multi-row cells. However, you can do this with a combination of nested grids:
<aura:application extends="force:slds">
<lightning:layout>
<lightning:layoutItem size="8">
<lightning:layout multipleRows="true">
<lightning:layoutItem size="12">
Section A
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section C
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section D
</lightning:layoutItem>
</lightning:layout>
</lightning:layoutItem>
<lightning:layoutItem size="4">
Section B
</lightning:layoutItem>
</lightning:layout>
</aura:application>
answered 2 hours ago
sfdcfoxsfdcfox
264k13210457
SLDS doesn't have a provision for multi-row cells. However, you can do this with a combination of nested grids:
<aura:application extends="force:slds">
<lightning:layout>
<lightning:layoutItem size="8">
<lightning:layout multipleRows="true">
<lightning:layoutItem size="12">
Section A
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section C
</lightning:layoutItem>
<lightning:layoutItem size="6">
Section D
</lightning:layoutItem>
</lightning:layout>
</lightning:layoutItem>
<lightning:layoutItem size="4">
Section B
</lightning:layoutItem>
</lightning:layout>
</aura:application>
answered 2 hours ago
sfdcfoxsfdcfox
264k13210457
answered 2 hours ago
sfdcfoxsfdcfox
264k13210457
answered 2 hours ago
sfdcfoxsfdcfox
264k13210457
answered 2 hours ago
sfdcfoxsfdcfox
264k13210457
264k13210457
add a comment |
add a comment |
Thanks for contributing an answer to Salesforce Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fsalesforce.stackexchange.com%2fquestions%2f257408%2flightning-grid-columns-and-rows%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
