1

i have the following css:

.THIS .noErrorStyle {
    padding-bottom: 8rem; 
    padding-left:2rem; 
    padding-right:2rem;
}

.THIS .errorStyle {
    padding-bottom: 4.3rem !important; 
    padding-left:2rem; 
    padding-right:2rem;
}

.THIS .removedPositionFixed {
    position: inherit !important;
}

and the following div in a lightning component:

<div class="{!v.meetingComponentSource == 'CreateMeeting' ? 'slds-modal slds-fade-in-open removedPositionFixed' : 'slds-modal slds-fade-in-open'}">

when i load the component, i can see the class in the HTML, but the style is not applied: enter image description here

any idea what is the issue? Thanks

  • Please share your component code too. Typically though, if the div is the first element in the component, the div is also .THIS, so .THIS .removedPositionFixed wont be found. You would need .THIS.removedPositionFixed (no space between .THIS and .removedPositionFixed) – Xander Jan 30 '19 at 14:13
  • Are you expecting a modal to render inside of your wrapper within a DIV? Unless there is an that causes the modal to pop up, I wouldn't expect that to happen, especially with a transition. It seems to me you are are trying to use CSS create an animation that executes a modal. That is not how they are supposed to be called. – crmprogdev Jan 30 '19 at 14:13
  • 1
    @crmprogdev im not trying to do that. im trying to override the position of the "slds-modal" class to not be "Fixed". – Dana Griff Jan 30 '19 at 14:24
  • @Xander it's the first div indeed. so just remove the spacing? – Dana Griff Jan 30 '19 at 14:25
  • 2
    Yup. Putting space between elements in css means that it's the child of parent. – Xander Jan 30 '19 at 14:31
1

if the div is the first element in the component, the div is also .THIS, so .THIS .removedPositionFixed wont be found. Changing it to .THIS.removedPositionFixed (no space between .THIS and .removedPositionFixed) worked.

Thanks to @Xander for the comment that helped me solve the issue.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.