Skip to main content

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.

Filter by
Sorted by
Tagged with
53 votes
8 answers
38k 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 ...
Benjamin Vogler's user avatar
46 votes
2 answers
11k views

Changing the color of a custom button

Is there a way of changing a custom button color? Not a button on the visualforce page but rather the ones created under custom and links on an object. Thanks. -K
Kenn K's user avatar
  • 885
36 votes
6 answers
4k views

Why do we still need to hack the Sidebar? Usecases - Workarounds - Alternatives

Since it seems to me, that a lot of people still need sidebar workarounds, I would be interested to learn about the use-cases, experienced challenges and (most important) possible strategies to avoid ...
Uwe Heim's user avatar
  • 28.4k
22 votes
1 answer
4k views

Guidance on styling existing Visualforce pages adequately in Lightning Experience without major rework

PPS This thread pre-dates the <apex:page lightningStylesheets="true" ...that is the first thing to try now. Original Thread Note the existing point - these pages have already been written (there ...
Keith C's user avatar
  • 136k
21 votes
3 answers
3k views

sfdc-styleguide usage questions in Salesforce1

I am trying to follow http://sfdc-styleguide.herokuapp.com/ 's usage of components and style classes. I have been unable to find references to any of the style classes described in the component ...
Mike Tetlow's user avatar
  • 1,571
18 votes
4 answers
37k views

Styling lightning:combobox drop down to not hide inside modal and extend modal length?

I am using the lightning:combobox standard component, and created a little UI that I then put in a modal window. It looks fine except for this issue.... I the drop down hides inside the modal ...
Tyler Dahle's user avatar
  • 2,729
17 votes
2 answers
6k 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 ...
Scott McClung's user avatar
15 votes
3 answers
26k views

Refer static resource in css of lightning component

I have a static component where the content is loaded dynamically as html. The lightning component provides some styles to present that content. I would like to provide icons, images that are defined ...
Bhupendra's user avatar
  • 305
14 votes
6 answers
19k 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 ...
smukov's user avatar
  • 5,613
13 votes
3 answers
4k views

Is there a way to use custom CSS with the Customer Portal in a reliable and maintainable way?

On Salesforce.com's Customer Portal marketing page there is a video with an example Customer Portal from Dell. The portal in the video is obviously using a lot of custom CSS which I know can be ...
Peter Knolle's user avatar
  • 29.1k
12 votes
2 answers
49k 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'}">...<...
Robert Sösemann's user avatar
10 votes
2 answers
9k views

Setting a max height for datatable in LWC?

I know when you specify a div with a height around your datatable you get a nice scrollable table: <div style="height: 300px;"> <lightning-datatable various-params></...
Tyler Dahle's user avatar
  • 2,729
9 votes
4 answers
3k views

Is it possible to make one css or js in common to all my Lightning web components?

Here is my situation, I have two (and soon more) LWC, inside each component, I have the classic : html, css, js and xml. In my case, the first LWC is having many css properties in common with the ...
BestAboutMe's user avatar
9 votes
1 answer
11k views

My Header and Footer overlaps with the content in a PDF Visualforce Page

I am trying to render my PDF page with a header and a footer, that are actually images, and a content, that expands in more than one page. The problems that I am facing are: The Header gets ...
Endrit Sino's user avatar
9 votes
5 answers
8k views

How to ignore Salesforce CSS on VF Page (with header)

I've been working on a Visualforce page using remoting, and am trying out building a custom UI to go along with it (not using any VF tags for the UI). While I'm aware that you can leverage ...
Michael Welburn's user avatar
9 votes
2 answers
2k views

Site.com CSS not recognizing media queries

Site.com strips out the media query definition from a CSS file when you try to import it, and if you try to manually edit the CSS file by adding the media query, you cannot save the file. Instead you ...
Sean Russell's user avatar
8 votes
2 answers
20k views

how do we access the image files from static resource in css?

I am trying to display images from a static resource in a css property. .PDF { width:50px; height:50px; background-image: url("{!URLFOR($Resource.FileTypes, 'png/pdf.png')}"; } What i ...
Prady's user avatar
  • 12.3k
8 votes
3 answers
16k views

How to make buttons in a lightning-datatable smaller in LWC?

I have a lightning-datatable in my Lightning Web Component (LWC) that has several buttons in each row (first button only shown here): These standard-sized buttons consume quite a lot of vertical ...
Keith C's user avatar
  • 136k
8 votes
1 answer
4k views

Dynamically Adding/Removing CSS in Nested Div

I'm trying to hide a div dynamically. This works for me. But when I try to do a nested div. It suddenly doesnt work anymore. Am I missing something? Component(Working) <ui:button label="Toggle" ...
cloudforce's user avatar
8 votes
4 answers
1k views

Any 3rd party SLDS Stencil CSS available?

To re-assure users who are waiting for output, the Salesforce Lightning Design system Loading documentation recommends using spinners (included in SLDS - see Spinners) and also Stencils (abstract ...
Keith C's user avatar
  • 136k
8 votes
4 answers
5k views

Mini Page Layout CSS in Visualforce Page

I've a VF Page which uses a Apex StandardSetController() to display the list of a Standard Object Records(Case in my Page). The mini page layout which is a standard functionality from Salesforce has ...
Vignesh Damodharan's user avatar
8 votes
3 answers
10k 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,...
sfdcfox's user avatar
  • 497k
8 votes
5 answers
10k views

Custom Fonts Not Working?

I am trying to apply a custom font to my Napili Template using Community Builder. I followed the steps laid out in Use Custom Fonts in Your Community. Here's my css definition: @font-face { font-...
Adrian Larson's user avatar
  • 151k
8 votes
1 answer
1k views

Why doesn't CSS overflow work in Visualforce tab?

Does anyone know how to get the CSS overflow property to work on a Visualforce tab? The concept I'm going for is possible, as demonstrated on JSFiddle. However, I cannot seem to apply the same concept ...
Marty C.'s user avatar
  • 4,479
8 votes
2 answers
4k views

Visualforce PDF and CSS overflow: hidden

I am trying to create a Visualforce page that renders as PDF. My problem is that I want to display as much of a rich text field as can fit. If I use overflow: hidden in my CSS, the text is displayed, ...
Daniel Hoechst's user avatar
8 votes
0 answers
2k views

Display hover using LookupHoverDetail along with scrollable outputpanel

I'm trying to create a pageblocktable that uses lookuphoverdetails to display the mini page details for Accounts on a custom object. The problem that I'm experiencing is that the pageblocktable is ...
Jason Cooke's user avatar
7 votes
3 answers
2k views

Where to store css when developing in salesforce?

When having a custom style, would it be better to store them as static resource or just dump those styles inside Visualforce page as inline CSS? If putting them as static resource, what are the ...
rpm07's user avatar
  • 511
7 votes
2 answers
27k views

One column/two column form responsive layout using SLDS that preserves field ordering?

When I Google about responsive design, I find many examples where two areas that display side by side: AAA BBB AAA BBB AAA BBB display one after the other when the screen width is reduced: AAA AAA ...
Keith C's user avatar
  • 136k
7 votes
2 answers
7k views

Word Break - Lightning

I want the string to be transfered to the next line in lightning. In salesforce classic I would just apply to the element style="word-break: break-all". In lightning there's a special tag for that. ...
EvAzi's user avatar
  • 1,051
7 votes
2 answers
14k views

How can i use var() in css in LWC?

This is what I'am trying to do: HTML: <li class="navBar2" style="--lwc-beforeColor: #0ec2df"></li> .css .navBar2{ height:29px; background-color: var(--lwc-beforeColor); } But ...
Akshay_SFDC's user avatar
7 votes
4 answers
13k views

Add spinner text along with spinner in lightning component

I am trying to add spinner text like 'Please wait while loading' along with dotted spinner. But the text is not displaying . It is displaying just a spinner. Can you identify what i am missing ? <...
Salesforce developer's user avatar
7 votes
4 answers
8k views

LWC Datatable any possible way to remove 'select all' checkbox?

So the datatable does ALMOST everything I need for my component, very handy. But I only want one selection of a row at a time. I want users to have to actually click each row if they want to select a ...
Tyler Dahle's user avatar
  • 2,729
7 votes
3 answers
8k views

How to mimic the look of a standard detail page in a VisualForce page

I have a standard Account detailpage, where I want to add a small VisualForce part in a column on that page. So I created a VF page that looks like this <apex:page standardController="Account" ...
Willem Mulder's user avatar
7 votes
1 answer
111 views

Should I add Sandbox support to VFFiddle? [closed]

I'm working on some updates to to VF Fiddle. I want to gauge the interest in running fiddles in sandbox and get some feedback on the security concerns. Because fiddles are not reviewed they could ...
Nathan Lipke's user avatar
7 votes
3 answers
7k views

How to change the header style for salesforce standard pages

Is there any way where I can change the header style of standard salesforce pages. I have a hint where I can upload CSS into documents and that will change the header style. Any body know about this ...
Shebin Mathew's user avatar
7 votes
1 answer
1k views

Lightning components and SLDS

I'm building a lightning component and want to style it using the SLDS. The relevant Trailhead Module recommends that you download the SLDS and install it as a static resource. So do the answers to ...
mkorman's user avatar
  • 4,056
6 votes
2 answers
5k views

Remove Last Page from the PDF

I have created PDF of Multipage, where in VF page I am using <apex:repeat .......> ///////// some code <div style="page-break-before:always;"/> </apex:repeat> But it adds a ...
Salesforce Steps's user avatar
6 votes
4 answers
25k views

Upload custom font on Marketing Cloud [duplicate]

I'm facing some issues with the upload of a custom font on Marketing Cloud. My clients purchased this new custom font and they would use it in cloud pages and email. I have only the css file and the ...
Alessia Annella's user avatar
6 votes
3 answers
11k views

How to control LWC styling dynamically?

I need different widths for my LWC for lightning and classic(lightning out) as my LWC is shooting out of card width in lightning. I am able to know whether a user is in lightning or classic using ...
Koustubh's user avatar
  • 1,203
6 votes
3 answers
3k views

How can I give tags of tag custom style?

I've PageBlockSection tags inside PageBlock tag, and I want to give all PageBlockSection tags inside PageBlock tag with specific id a custom style. Any Idea ? <apex:pageBlock id="BlockWithRedColor"...
user3003810's user avatar
6 votes
1 answer
5k views

Using SASS/SCSS with Lightning Web Components

We are building Lightning Web Components and styling each one using the CSS file within each component folder. This is starting to become long and out of control. I understand that one could upload a ...
Andrew's user avatar
  • 191
6 votes
2 answers
2k views

Which metadata stores custom CSS for a community?

When creating a community, you can override the CSS of a template. Use custom CSS to override the default template and Branding panel styles. We recommend that you use custom CSS sparingly, because ...
Tyler Zika's user avatar
  • 2,892
6 votes
2 answers
18k 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 }" ...
Franz's user avatar
  • 115
6 votes
1 answer
4k views

How Can I Style a Lightning Component with Bootstrap Styling?

I have a question regarding styling Lightning components. On several occasions lately, I have found myself having to opt for the use of a standard HTML tag styled with bootstrap on which I call core ...
Daniel Fuller's user avatar
6 votes
1 answer
1k views

How to let the end users override CSS of managed package's LWC?

I am rewriting a complex Visualforce component into LWC. It's an activity timeline / Gantt chart that's part of a managed package. The old version let the end users override the bar colo(u)rs with a ...
eyescream's user avatar
  • 24.1k
6 votes
1 answer
2k views

Setting Font Face for Visualforce Email PDF attachments "messaging:attachment"

I'm having lots of trouble setting font faces for VF Email PDF attachments (see my code below). I've tried the conventional "font" tag with no luck, even CSS doesn't work! What am I doing wrong? <...
Eric Luu's user avatar
  • 890
6 votes
1 answer
2k views

Is it possible to set # of visible lines on a multi-picklist field with lightning-input-field in LWC

While using lightning-input-field within a lightning-record-edit-form in a LWC, I noticed that multi-picklist fields don't respect their default visible lines setting. It always seems to show 4. I've ...
Kris Goncalves's user avatar
6 votes
0 answers
1k views

Recaptcha in Salesforce Lightning component

My requirement was to create a custom lightning component, which will be hosted in a community and will allow users to create cases. Before submitting the case, users have to successfully pass 'I am ...
Hareesh Mohan's user avatar
5 votes
4 answers
29k 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&...
BlondeSwan's user avatar
  • 1,098
5 votes
5 answers
28k views

LWC: Adjust Width of Lightning-Button

Given the following: <div style="display:inline-block"> <lightning-button style="..." class="..." onclick={...} label="..."></lightning-button> </div> How can I adjust ...
Mr. B's user avatar
  • 435

1
2 3 4 5
24