Questions tagged [lightning-card]

For questions related to the lightning:card component.

Filter by
Sorted by
Tagged with
2 votes
2 answers
83 views

Consistent spacing in Lightning card

I am displaying Lightning cards & have a problem where the card contents & card height of the cardsaren't lining up correctly when a certain field (TextAboveImage) has content or doesn't. ...
Michele Kleinhomer's user avatar
0 votes
1 answer
471 views

Aligning button next to lightning card title

I am seeing so many examples to align lightning card title and a button. But all the examples that are provided are using slots="actions" in the button. But that will align the button to the ...
CodeGirl's user avatar
2 votes
1 answer
469 views

Using lightning-card to achieve a similar look to Opportunity Related Lists

Is it possible to use the lightning-card to emulate the look of Related Lists on the Opportunity Lightning Record Page? For example... In my case, I don't even need the action buttons - only a header ...
nstuyvesant's user avatar
0 votes
1 answer
269 views

LWC Lightning-card slot alignment issue

It appears that I can't put a lightning-input in a slot. I would like the input and button to line up side by side on the right, preferably in line with the lightning-card title. Any ideas on how to ...
mackmama's user avatar
  • 699
1 vote
1 answer
2k views

Remove bottom border from Lightning Card?

I have a Lightning Card in a Tabset and I cannot remove the bottom border. Below is the code (I have removed the other tabs for simplicity). I needed to use a CSS to display the Border in the Card - ...
Jeff Callahan's user avatar
1 vote
1 answer
366 views

How to style lightning grid and icon like this photo?

I am trying to get a lightning grid with lightning cards similar to this example below. I have my wireframe and the actual image. It seems that there can be more cards you can scroll through using the ...
Alan's user avatar
  • 27
1 vote
1 answer
4k views

Aligning Footer Button to right in Lightning card

I am working on dashboard screen. I have a lightning card which where I want a button on right side inside a footer. Below is the code I am using. But When I am trying to align the button inside ...
Pankaj Andhale's user avatar
0 votes
1 answer
2k views

LWC - Refresh contents inside a single <lightning-tab>

I have a component (container) with a lightning-tabset with a single lightning-tab. Inside the tab is a component (dataComponent) which pulls "Item" records via Apex and assigns them to a ...
Adam Drissel's user avatar
0 votes
1 answer
2k views

how to remove or customize the header of lightning-card in LWC?

I want to add a dark blue colored header for lightning-card lwc, when i try to use a div tag at the top and color it blue there is a blank white space above it. Is there any way to remove this header ...
Hemanth kakarla's user avatar
0 votes
1 answer
4k views

How does slot attribute works in lightning-button?

I have the below example where a slot attribute is passed to the lightning-button to align with the lightning-card. Is there a documentation where I could read more about the slot property? <...
Krishnamurthy's user avatar
0 votes
1 answer
2k views

Space between card header & lightning-datatable

maybe you know the problem that there is a white space between Card Header and a lightning-datatable. You can see it on the screenshot. Do you know how to get rid of it? Here my Code: <article ...
user avatar
4 votes
1 answer
2k views

base vs Narrow in lightning-card in LWC

I am new to LWC and trying to understand the concepts. In lightning-card, as per the documentation, the variant can be base(which is default) or Narrow. But from the below code, the output is same for ...
Jaya's user avatar
  • 161
0 votes
2 answers
3k views

How do I get a lightning card to expand to the size of the enclosing layout item?

I have HTML that looks like this: <template> <lightning-layout size="12" multiple-rows="true" vertical-align="...
Chuck's user avatar
  • 933
0 votes
1 answer
250 views

want to navigate to detail page

Hi yal i am New on salesforce want to navigate to a contact Detail page through Button.How to pass parameter ? How can i do please help. Apex Class:- public class ShowContactInCard { @AuraEnabled ...
mirza Kahekashan's user avatar
0 votes
1 answer
1k views

Content is coming out of lightning card in lwc

I have a form where I need to display few details of logged in person on customer community. I am using lightning layout and layout item within a lightning card. I have first name with 40 chars and ...
Kanikala's user avatar
  • 197
1 vote
1 answer
7k views

Text doesn't wrap in <div> and <lightning-card>

I have a little problem, text inside tags doesn't wrap (I don't use <p> and write text in <div>). HTML is very simple, but I can't solve the problem: <template> <div class=&...
senoron's user avatar
  • 192
0 votes
1 answer
1k views

Add a row inside a table and a LWC Template

I was wondering if there is a way to add a row on a click of a button inside a LWC Template. I am able to make it work with a simple table but when I try to loop through an array and create a row of ...
Eric's user avatar
  • 73
0 votes
0 answers
145 views

Lightning Carousel data has 0 rows

im develop a lightning web component with an apex call wich in his initial deployment the query return 0 rows, but in a future time will be used, and the query eventually will return data but the ...
Juan Pablo Hernández Menares's user avatar
3 votes
1 answer
4k views

How to wrap lightning-card's title?

We have an LWC and sometimes the title can be really long. I have seen How do I make a Lightning Card title wrap to the next line on a small screen? but that did not help. Any other suggestions? &...
MarcLee's user avatar
  • 105
0 votes
1 answer
7k views

Using slds grid I want to display 3 lightning cards in one row

I have a parent component sending the values for lightning card one by one to the child component. The child component contains the lightning card. I want to display 3 cards in one row but all the ...
sfdcLearner's user avatar
0 votes
1 answer
5k views

How to dynamically create lightning cards in lwc, with 2 cards in a single row using grid

I want to iterate over records and display those many number of lightning cards. Each row should have 2 cards using grid. I tried using for:each but it is only working on list. Below is my code: &...
sfdcLearner's user avatar
1 vote
1 answer
617 views

Nested lightning:button onClick Not Firing

When I have a button inside a component inside a lightning:card either as a body element or an action, the onClick is never fired. If I move the lightning:button outside of the container, the event ...
Benny's user avatar
  • 115
1 vote
2 answers
5k views

Edit the footer of lightning card

I have created a custom lightning page and it looks like the below screenshot. But I want to place the delete button exactly before the cancel button Can someone please suggest to achieve the same? ...
gs650x's user avatar
  • 2,650
4 votes
1 answer
10k views

SLDS lightning card margin issue

When lightning cards render, the first one seems to always be missaligned at the top no matter what. (this is obviously fixable with CSS). I used dymamic rendering, standard lightning:Card component ...
glls's user avatar
  • 20.1k
1 vote
1 answer
7k views

Why adding "position:fixed" and "width:100%" styles to lightning:card element fixes right margin?

Let's consider a simple component: <aura:component implements="force:appHostable"> <lightning:card class="test" iconName="custom:custom62" title="Test Card"> <aura:set ...
Przemysław Długoszewski-Tamoń's user avatar
2 votes
2 answers
8k views

Remove whitespace from lighting:card header

There's quite a bit of space left where title and actions go. Ideally I'd like to remove it. What are the options here?
dzh's user avatar
  • 4,086
2 votes
6 answers
9k views

Any way to make the Title of a Lightning:Card into a hyperlink?

I've got a lightning:card element that has the name of a record as its title and shows some key info of it in the body. I'd like the title to be a link to the record page of the record. I can't just ...
David Hasterok's user avatar