function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Marco SchmitMarco Schmit 

CSS problems in Lightning Component

Hi guys,

I'm currently trying to implement a floating material design button that has a fixed position.
Normally I would do it this ways:
.THIS #someBtn {
position: fixed;
bottom:10px;
right:10px;
}

This should put the button at the bottm to the right side and should stay there when I scroll but it does not really work.
Any suggestions?

Thank you!


 
Mohith Kumar ShrivastavaMohith Kumar Shrivastava
I would suggest declaring a class on your lightning compoenent and using the class for styling

Sample code
 
<div  class="dropzone" >


Styling example

.THIS.dropzone{
         border: 2px dashed #bbb;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        padding: 25px;
        text-align: center;
        font: 20pt bold 'Vollkorn';
        color: red;
    }

Please note i observed the lightning component sytles are sensitive to spaces also .So be clear not to leave any space