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
0 votes
0 answers
12 views

Changing Animation keyframes Dynamically

I am creating a custom progress bar, and wish to display a light that animates from left to the right of the bar. Here is the code I have attempted. <template> <template if:true={target}&...
user avatar
0 votes
0 answers
22 views

Responsive lightning web component

With this code, my display is not responsive, when I zoom the address goes to the far right and when I zoom out, everything shifts to the left (the right part of my card becomes empty) and the green ...
user avatar
1 vote
0 answers
25 views

Update CSS Of Lighting input of Type File (LWC)

I want to update CSS of <lightning-input type="file" I want to change the Text of button as well as want to move attach button next to upload file. I want to remove text or drop files I ...
user avatar
0 votes
0 answers
15 views

I'm trying to get the two buttons to fill the width of the Template. How would I do this

I want it to look like each tab is 50% of the template. <template> <lightning-tabset variant="scoped" active-tab-value="2"> <template class="slds-...
user avatar
0 votes
0 answers
16 views

Samsung Galaxy A71 native email not responsive [closed]

We have designed an email template in the marketing cloud email studio, using the block editor and not the simple code editor. All tests on mobiles are working well, except Samsung Galaxy A71 email ...
user avatar
  • 71
1 vote
1 answer
31 views

Break space not working for Arial Unicode MS in Visualforce Page

I have been trying to implement Chinese traditional characters in my Visualforce pdf. Seeing the salesforce documentation, I changed the font to Arial Unicode MS but the word-wrap: break-word; is not ...
user avatar
0 votes
1 answer
12 views

LWC - Styling the button

Quick question for the styling in LWC. This is styling in JS. function changeVisibility() { document.getElementById("imgbox").style.visibility = "none"; } And I'm trying to do ...
user avatar
  • 91
0 votes
0 answers
20 views

lwc date field calendar year part missing (not able to select year)

<!-- 1st row start --> <div class="slds-col slds-size_1-of-1 slds-medium-size_6-of-12"> <label class="slds-form-element__label"> ...
user avatar
  • 1
0 votes
0 answers
8 views

Suppress/Modify Lookup Placeholder in Standard Contact Support Form

We are using the standard Contact Support Form on our Community. In it, we have a Lookup to an object called Teradata Event. This results in the form element's placeholder element to show the name of ...
user avatar
0 votes
1 answer
25 views

How can I show more than 3 cards in LWC?

My page looks like this (I can see only 3 cards but there are more) https://i.stack.imgur.com/wnjw7.jpg How could I change this to show as many cards as possible? Should I use some attribute from SLDS ...
user avatar
0 votes
1 answer
21 views

Salersforce community theme: List-style CSS not working

I am trying to implenent custom CSS into Salesforce communities. However, I've encountered an issue where list-style: none is not working, causing bullets to appear on a navbar. This does not happen ...
user avatar
  • 17
0 votes
0 answers
18 views

Using vendor prefixes in lightning web components

I'm junior salesfroce developer so my question may seems funny for you, but I would like to understand what is going on underneath. My team is using autoprefixes, this is one of requirement so I'm ...
user avatar
  • 1
0 votes
0 answers
21 views

CSS Image not showing in Gmail using Visualforce page email template

<messaging:emailTemplate subject="Enquiry Regarding Autism Assessment" recipientType="Lead" > <messaging:HTMLEmailBody > <html> <div style="float:left&...
user avatar
0 votes
0 answers
22 views

CSS is not getting applied in HTML even when explicitly mentioned

I have added a CSS class to my div to get the margin (elucidated in the picture below). Whereas, the margin is not getting applied to the component. The CSS for that class is not getting displayed in ...
user avatar
  • 13
0 votes
2 answers
25 views

Responsive header with lightning web component

I have this code, it is a header with LWC, divide into three parts, but the problem I have that my display is not responsive, each part points to the other The part 2 and 2 overlap the part 1. How can ...
user avatar
4 votes
1 answer
89 views

How to set consistent styling across many LWCs using styling hooks?

This Style Components Using Lightning Design System Styling Hooks documentation illustrates how to set custom properties on an individual custom LWC to change the styling: /* myBaseButton.css */ :host ...
user avatar
  • 129k
0 votes
2 answers
50 views

Want to increase lwc icon size in in specific pixels. so what i did is added style="size:50px" this is not worked for me

This is the code. <lightning-button-icon style="size:50px" icon-name="utility:settings" variant="bare" alternative-text="Settings" icon-class="slds-m-...
user avatar
0 votes
0 answers
26 views

Crop Image in Visualforce PDF Render

I am displaying an Image in a visualforce email template attachment rendered as PDF, this image dimensions are fixed to 500x250, I would like to crop the bottom part and right side and just scale the ...
user avatar
-3 votes
1 answer
35 views

Rendered LWC should not contain extra attribute in rendered element

I defined some styles like this .tableRow { padding: 8px; } But, when it is rendered some extra attribute is added to this class like this .tableRow[c-test_xxxxxxxxxxx_xxxxx] { } Can we prevent the ...
user avatar
0 votes
0 answers
20 views

Long Text in Li is displayed in the second line behind the bullet point

I have tried using text-indent, still no use. Please help me on the below code and let me know where am doing wrong **css*** .checkList li:before, .check { padding-left: 10px; color: rgba(...
user avatar
0 votes
0 answers
12 views

conditionally highlighting text in aura lightning datatable

I am trying to conditionally highlight text on an aura datatable with edit access. I cant seem to get the css to conditionally show the highlighted text. At present it is not possible to use a LWC as ...
user avatar
0 votes
1 answer
39 views

quick action combobox overflow

I have a quick action that has two combobox and one textarea. The combobox opens behind the quick action footer. How can I handle this in LWC? This is the HTML code: <template> <...
user avatar
  • 39
0 votes
1 answer
25 views

Lightning component modal window with fixed size and proper closing buttons

I want to use a salesforce modal window using a lightning component, fixing its size to 90% width AND height of the screen to display larger content (a pdf preview). The standard modal component seems ...
user avatar
  • 165
0 votes
0 answers
11 views

CSS styles Einstein Chatbot CDN link

I am developing Einstein Chabot with Android application. I need to reference styles for prechat page. To reference styles I am looking for salesforce CDN url same as bootstraps styles. How can I get ...
user avatar
  • 61
0 votes
0 answers
39 views

LWC slds-grid div not as wide as containing slds-col divs, causing left sticky column div to unstick

I have a two components, parent and child. The child is a gantt chart. I have set the left column to position: sticky and it works unless the second column becomes very large then the left column is ...
user avatar
1 vote
1 answer
36 views

Remove box-shadow on Active Cell in datatable

I've been pouring over slds styling hook docs and datatable docs and I cannot figure out how to remove this box shadow when the cell has focus. I know for sure it's box shadow because when I uncheck ...
user avatar
  • 11
0 votes
0 answers
16 views

lightning-input LWC zoom in on mobile

I have an LWC form inside a site as an iframe. The LWC form contains basic information for registration. From computer - working just fine. But when I'm trying to open my site from my mobile (chrome ...
user avatar
  • 961
0 votes
1 answer
17 views

Extra space at bottom of table when adding sticky header

I have a table of data using the < table> element inside a < div> element. The table needs to scroll vertically as needed and the header is to remain in place. Nothing too fancy! Looking ...
user avatar
0 votes
1 answer
27 views

align command buttons to center in Visualforce page

Command buttons have aligned to Right ,how to recenter them without using CSS? <apex:page standardController="Contact" lightningStylesheets="true" extensions="...
user avatar
0 votes
1 answer
36 views

How to separate these elements in html/css

In my work project we need to leave a similar space between these buttons. They only overlap in the process of becoming responsive. My superior and I have tried many forms of css and slds stuff and ...
user avatar
  • 19
0 votes
1 answer
33 views

How to standardize the size of tables generated by a repeat?

I'm setting up this table, but the fields that will compose the table are dynamic, and their sizes vary, does anyone have any idea how I can make the tables standardized? Also, the bottom element is ...
user avatar
  • 1
0 votes
3 answers
49 views

SLDS Source Code

I want to download the whole SLDS and inspect the CSS code on which it is based. For example: <div class="slds-align_absolute-center" style="height:5rem">This content will be ...
user avatar
0 votes
0 answers
8 views

Having trouble with media queries on record detail page

I've created a testing Lightning Web Component. I'm using media query to change text colour. It works fine, if it's rendered on a blank page or when I embed the LWC in an Aura App and view it on ...
user avatar
1 vote
1 answer
37 views

D3 javscript: How to add a div in aura component?

I am trying to create a map hierarchy visual aura component using D3 library and d3 tree and d3.hierachy methods. The original code had circles in place for the nodes, but I want to append a div so ...
user avatar
  • 41
0 votes
1 answer
160 views

Opening Lightning Combobox options upwards

Since my dropdown is at the bottom of the page, if we try to select a value, it adds extra scrolling as select options open downwards. Can we open it upwards instead of downwards, either using ...
user avatar
1 vote
1 answer
160 views

How to remove spaces between Lightning-card and border

I want to remove space between "inner_card" and "my-card-child". I tried it with margin and padding between those card and div tag. but i'm not getting solution for this. I wan to ...
user avatar
0 votes
0 answers
14 views

Can you use CSS overrides to hide actions on Files Related List in a Community

I would like to prevent community users from uploading files on a Files related list on the contact object, but this related list is a system object and is not editable. Is there a way to use CSS ...
user avatar
3 votes
0 answers
77 views

Media Queries in LWC Not Loading

I have a bunch of LWCs that are styled with a CSS grid. It seems like the media queries have stopped loading. I am not sure how long this may be been the case. Just recently had a BA test something ...
user avatar
1 vote
1 answer
77 views

LWC Change iteration to color even indexes

I am trying to find how to change the row color of even rows so it alternates between odd and even indexes in my list of divs so odd would be a background of say white and the evens would be a ...
user avatar
2 votes
1 answer
117 views

"No TOKEN named force:base.varFontSize7 found" design token build error started today

We have a LWC that has not changed for months that includes a reference to the $font-size-7 design token: .notes-output__span { min-height: calc(var(--lwc-varFontSize7,1.25rem) + 1px); } and ...
user avatar
  • 129k
0 votes
1 answer
28 views

change the background color depending on the prefix

I want to change the background color depending on the prefix....the command I'm trying to use has given a syntax error, where am I going wrong? Or is this idea not possible <body style="{!if(!...
user avatar
  • 1
0 votes
1 answer
74 views

blob topdf as attachment PDF apex no renders background color

I'm creating an HTML string that I put in a in blob.toPDF to send PDFs as attachments public static Messaging.EmailFileAttachment attachmentBuilder(String fileName, string attachEmailInHTML){ ...
user avatar
  • 49
0 votes
1 answer
56 views

Alignment of lightning-datatable headers

I'm attempting to right-align the contents and header values of a lightning-datatable in an LWC. I can get the content to align correctly by adding cell-attributes but the column header remains left-...
user avatar
0 votes
0 answers
25 views

Hide filter option on report side in experience cloud

we are setting up the experience cloud and want to give some reports to our external users. However what we would like to avoid is them playing around with filters. Is it possible to use CSS to hide ...
user avatar
0 votes
0 answers
80 views

Button-menu-item's displays below DIV's with higher z-index

I'm creating a process design App with process steps. Each process step is represented by a child LWC component having a container div with a different z-index, to allow correct placement and drag &...
user avatar
  • 16
0 votes
0 answers
24 views

CSS within Static Resource

I read on other post that when using css within static resource you cannot use classes? I have per example .columnHeader { float: left; width: 50%; padding: 10px; text-...
user avatar
  • 73
0 votes
1 answer
45 views

Getting image overlap with border in Visualforce page. How to avoid it?

As you can see the blue color header image is overlapping with my border on the top of the page both sides how to avoid it. Here is the style i have used- <style> html{ border: 3px solid black;...
user avatar
  • 1
0 votes
0 answers
13 views

I want to hide the edit buttons present beside the column records(I have used lightningstylesheets=True for my vf page)

I have changed my existing vf page to lightning by using lightningstylesheets=true.After changing my apex:pageblocktable is looking wierd with that edit buttons and below is my code. apex:pageblock ...
user avatar
1 vote
1 answer
66 views

CSS styling hooks not applying for lightning-badge in LWC

I have the below lightning-badge component where I am trying to change the background color. The background color is not changing. What could be the issue? HTML: <lightning-badge label={product....
user avatar
-3 votes
1 answer
41 views

Add Chart to our LWC [closed]

i want to get something just like this , is it possible with LWC , with the possibility that the arrow change the position in depend of the condition that i will make in my JS , should i just use the ...
user avatar

1
2 3 4 5
21