function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Jonathan Wolff 7Jonathan Wolff 7 

Align Description on bottom in Aura Component

Hello, I have a component in whick I insert the header and a description. I want the header to be on the top of the component and the description on the bottom. Can you tell me how to change the CSS to make it?

Code

Component:

<aura:component implements="flexipage:availableForAllPageTypes" access="global">

    <aura:attribute name="url" type="String"/>
    <aura:attribute name="header" type="String"/>
    <aura:attribute name="description" type="String"/>
    <aura:attribute name="font" type="String"/>
    
    <a href="{!v.url}" target="_blank">
            {!v.header} 
            <br/>
            <br/>
            
            
            {!v.description}
            {!v.fontcolor}
    </a> 
    
</aura:component>

CSS

.THIS header {
    object-fit: contain;  
    background-color: white;  
    border-color: white; 
    height: 150px;
    max-height: 120px;
    width:170px;
    
    
}

.THIS description {
    object-fit: contain;  
    background-color: white;  
    border-color: white; 
    height: 150px;
    max-height: 120px;
    width:170px;
       
    
}
SwethaSwetha (Salesforce Developers) 
HI Jonathan,
This gives a blank output. Can you share the working snippet please so I can check and suggest. Thanks