Stack Exchange Network

Stack Exchange network consists of 175 Q&A communities including Stack Overflow, the largest, most trusted online community for developers to learn, share their knowledge, and build their careers.

Visit Stack Exchange

Questions tagged [css]

Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation semantics (the look and formatting) of a document written in a markup language.

0
votes
0answers
20 views

How to Toggle (Hide/Show) in Lightning with no Delay or Resizing

I'm conditionally toggling sections in a Lightning Component that each contain a lightning:datatable, and I'm stuck in a bind of choosing either the table resizing when the section is first expanded (...
1
vote
2answers
37 views

How can you modify standard lightning component styles from Community CSS?

I have a standard lightning dashboard component that has been added to a communities page. I'm trying to hide the red icon on a standard dashboard component on a community page shown below: I've ...
0
votes
0answers
10 views

Specify (fallback) font stack in Community page

How can I specify "sans-serif" as the fallback font in the font stack for a Community page? The template is based on the Napali theme and uses a custom font. For some users, the custom font does not ...
0
votes
0answers
38 views

Cannot change the css of the lightning-tabset standard web component? [duplicate]

This is my lwc tabset code: <lightning-tabset variant="vertical" active-tab-value="6" > <template for:each={opps.data} for:item="opp" > <lightning-tab label={opp.Name} key={...
0
votes
0answers
15 views

Resize the Scrolling Div dynamically base on Content from the Server

I have a Div with input text and scrolling, which a click on that input, will bring accounts from the server using action function and allow the user to search for his account dynamically. Until that ...
0
votes
1answer
31 views

File card Resizing

Does anyone know how to resize a filecard lightning component , i tried to make it of an avatar size ? My component looks like that : I did try to add some css as i followed the same thing in here ...
0
votes
2answers
31 views

CSS Override for SLDS-Grid_Container

Was wondering if anyone has any ideas on the actual CSS that lies behind the slds-grid_container (actually wondering on the slds-tree_container class which is on the Lightning:tree component). I am ...
0
votes
1answer
25 views

Lightning Icon Background color not changing

I have a lightning icon in my lightning component. It is an icon of type standard and I want to change its color: Component <div class="slds-media__figure"> <lightning:icon iconName="...
0
votes
1answer
49 views

Lightning OverlayLibrary Background Color for Header and Body

I just want to modify the background color of whole header section and body of my lightning overlayLibrary. here is my code : Popup Component <aura:component implements="forceCommunity:...
0
votes
0answers
19 views

CSS getting distorted when showHeader=“true” in Vf page

I have a well know issue here i have to use show showHeader="true" but my page's entire CSS is getting distorted. I have gone through this post which suggests to install VisualStrap but again only ...
0
votes
1answer
29 views

How do I remove the padding around a Salesforce Lightning Community page?

Lightning community pages have a wrapper div which has padding: 0.75rem all around the page. <div class="slds-col--padded contentRegion comm-layout-column"> all content here </div> I ...
0
votes
0answers
9 views

How to use static resource image in Lightning component CSS file [duplicate]

I am trying to use a static resource in a lightning component .css file: .THIS .website-header { height: 209px; background-image: url('{!$Resource.website_header}'); } But it renders without ...
0
votes
1answer
21 views

How to have a Radio Group of Button Type with gap between each button

I would like to use a Radio Group of Button Type: <lightning:radioGroup name="radioButtonGroup" label="Radio Button Group" options="{! v.options ...
1
vote
1answer
27 views

Should custom labels be used as constants?

From the documentation Custom Labels are primarily meant for multi-language translation use, but our company does not use them for this purpose, but uses them extensively for text used in pdfs/VF ...
2
votes
0answers
13 views

Content Overflow with <lightning:checkboxGroup>

I want my lightning:checkboxGroup to overflow into two columns in my fixed width and height box. I believe the best way to do this is to edit the css but I am not sure if this is possible with the ...
0
votes
1answer
58 views

element.classList.add('class-name') is ignoring the '!important' indicator in the css

This seems to me an odd problem. I have an LWC, it has an unordered list, then loops through items and creates a list item for each one. I have an onclick for my list items so when a user selects ...
0
votes
2answers
27 views

changing validation error message

I want to display an error message when a form is submitted but not all the required fields filled out. I wanted to use the "required=true" on apex:input tag but because I'm using JS function later ...
0
votes
0answers
81 views

lightning-input-field [Lightning Web Components]

I am currently trying to make a table where I use the lightning-record-edit-form. I am trying to make the helptext icon disappear (without deleting it on the field itself), without any luck.. Can ...
0
votes
1answer
25 views

Star Rating not rendering on custom HTML email in Marketing Cloud [closed]

We have created an email in Marketing cloud using an existing Blank template where we can drop our custom made content blocks. And for one email we have a requirement where we need to capture the ...
11
votes
2answers
293 views

CSS animation in LWC not working

I'm unable to get a simple css fade-in-out text animation to work in LWC. The text displays on the page okay, but it does not fade in/out like expected. It seems as though the keyframes are getting ...
0
votes
1answer
32 views

Animation in lightning component

I would like to put simple animation in my lightning component. I tried to use an existing CSS from this framwork : https://github.com/IanLunn/Hover The effect that i want to use is Grow List of ...
0
votes
1answer
78 views

Recreating lightning-button with custom color

I am trying to replicate lightning-button in my Web Component because I need to use custom colors, and supposedly you can't override the lightning-button with css to change these colors... So here is ...
0
votes
1answer
179 views

Changing colors of lightning-button

How can I change the colors of lightning-button? I tried doing this in my css: .my-button { background-color: #14a6bc; color: #ffffff; } and applying that class to my <lightning-button&...
0
votes
1answer
50 views

How to increase spinner window size in VF Page?

<apex:actionstatus id="sts"> <apex:facet name="start"> <div class="slds-spinner_container"> <div id="mySpinner" role="status" class="slds-spinner ...
1
vote
0answers
93 views

Is there a way of dynamically binding attributes to css variables, allowing for dynamic styling rules?

The general gist of this is to allow for css variables to dynamically update when the attribute on a component updates. This is possible with the Aura framework components using the aura:html tag like ...
0
votes
1answer
110 views

How to change the color of lightning spinner?

<div class="demo-only" style="height: 6rem;"> <div role="status" class="slds-spinner slds-spinner_medium"> <span class="slds-assistive-text">Loading</span> <div class=...
1
vote
1answer
261 views

lightning-datatable - remove header actions

Is it possible to remove the header (column) actions completely from lightning-datatable? It seems that no matter what I do I'm still stuck with Wrap Text and Clip Text actions. UPDATE Adding more ...
0
votes
0answers
19 views

CSS Style is lost for overflow layoutItem

I'm using lightning:layoutItem to display a list of records. There are 17 layoutItems inside a lightning:layout. However, there is a bug, that the CSS style is not applied to those layoutItems outside ...
-1
votes
1answer
46 views

How to add left and right borders using slds

Image: In this image, The edges are not cutted very properly.I really Look some thing like this. I have tried using "slds-box" still issue is same. How to do like this: Lightning code: <div ...
1
vote
1answer
25 views

Setting Inline CSS from Component Attribute

In a custom Lightning Component, I'm trying to set the padding-top CSS property on a div with a number (Double) that comes from an attribute on the component. I'm having trouble figuring out what the ...
1
vote
1answer
44 views

<lightning:select> limit height?

Is it possible to mention the number of options to display in . <lightning:select> <option>option 1</option> <option>option 2</option> <option>option 3<...
4
votes
2answers
1k views

Set CSS class dynamically in Lightning web component

How would I translate that from Aura to LWC? <aura:iteration items="{!v.contacts}" var="contact"> <div class="{!contact.isActive ? 'slds-tabs--path dimmed' : 'slds-tabs--path'}">...<...
0
votes
1answer
144 views

How to use Salesforce Sans font in lightning component?

I have uploaded the Salesforce Sans font as satic resource in my dev org. How to use this sytle in my lightning component. <lightning:layout multipleRows="true"> <lightning:layoutItem ...
1
vote
1answer
32 views

custom CSS not applied to div

i have the following css: .THIS .noErrorStyle { padding-bottom: 8rem; padding-left:2rem; padding-right:2rem; } .THIS .errorStyle { padding-bottom: 4.3rem !important; padding-...
0
votes
1answer
174 views

Dynamically change background color using controller on lightning component

I would like to implement component having a background color change feature. I tried to get some information on how to change CSS using Lightning Component controller, I couldn't get much about it. ...
0
votes
1answer
54 views

Is it mandatory to have Assests/Images/CSS present in SFMC?

We are about to kickoff with ipwarming. we have emails ready, but the assets used in email creation are hosted on different server(not present in SFMC). Is this something I should worry about, and ...
0
votes
0answers
7 views

How do I control css for Chatter Feed files showing thumbnails?

We have a Chatter Feed showing for our portal which includes showing the files attached to that feed item. The problem is the thumbnails showing for the files are squashing the file name in the right ...
0
votes
2answers
227 views

How to change a class of 1 element through onclick from 2 element?

I have 2 lists. First is all my objects. Second - selected object (I use "Select" button to add my obj to second list but without deliting it in the first list). I can also delete the objects from the ...
1
vote
0answers
36 views

Change the style of 1st list's element through onclick from 2nd list's element

I have 2 lists. First is all my objects. Second - selected object (I use "Select" button to add my obj to second list but without deliting it in the first list). I can also delete the objects from the ...
0
votes
1answer
90 views

Change the div's css style in <aura:iteration>

I have a component: <aura:iteration items="{!v.objects}" var="obj"> <lightning:layout multipleRows="true" class="layoutBigCardsColumn"> <div class="slds-...
0
votes
1answer
81 views

How to send the div's style through button's onclick in <aura:iteration>?

Even the example from "Lightning Aura Components Developer Guide " doesn't work. I can't set the style to my div. It's because of iteration. How can I fix that? cmp: ...
0
votes
1answer
71 views

Increase size of Lightning Component to fit properly on a record page

The component I created on the right appears smaller than the activity card. I've tried several ways to increase it's size but have failed. Is there a way to make it look like the card below it? ...
0
votes
1answer
28 views

Can we blink a primary tab after opening it via any css or js?

I am trying to open a primary via this: sforce.console.openPrimaryTab(null, '/lightning/n/***', true, 'TestSearch', openSuccess, 'salesforceTab'); Now if I pass false, the tab opens and does not ...
7
votes
3answers
412 views

Target inner elements of standard Lightning Web Components with CSS

Say we have a LWC with the following template in a component named example: <template> <lightning-textarea class="test"></lightning-textarea> </template> And some css to ...
5
votes
1answer
224 views

Can we specify a minimum height for a lightning:datatable/lightning-datatable?

Problem lightning:datatable (rendered as a lightning-datatable) places itself in a wrapper that is only exactly as big as it needs to be. If you click on a header-level action in a table with no rows,...
0
votes
1answer
71 views

Fixing CSS in lightning community

I'm trying to fix css for the lightning community, I have created a custom theme for a community, and my component implements forceCommunity:layout, due to forceCommunity:layout by default max-width ...
1
vote
0answers
85 views

Adjsting the height of component dynamically

I have two child component A and B inside a parent component stacked one after other.Component A is supposed to be static and does not contains scroll bar.How ever its height changes depends on ...
1
vote
2answers
48 views

HTML Email Template : Looks Okay In The Editor, But Loses All Styling When Sent

I'm trying to create an email template in HTML. I originally did all the styling as an internal style - But later found out that styling must be done as inline css. My creation looks fine in the ...
0
votes
3answers
626 views

How to override CSS of Lightning Component

I want to change the styling of several Lightning Component elements such as: Changing the background of navigation of Tabset from light grey to blue: From this To this The code I written in .cmp ...
3
votes
2answers
466 views

How do you center align the text of the column headings for a lightning:datatable?

I'm able to apply color or make the column heading text bold, but I can't center align the text for some reason. <lightning:datatable data="{! v.data }" columns="{! v.columns }" ...