'How to properly align the buttons based on the text

I have job notifications that I was displaying on my home tab, like below.

enter image description here

but sometimes if the job title text is long, apply and view buttons are not displayed properly.

enter image description here

    My CSS(For job title):
    
    .job-container .container .job-tile .job-card .heading {
        font-size: 15px;
        font-weight: 600;
        margin-left: 10%;
        margin-top: 5%;
        max-width: inherit;

    For job description:
    
    .job-container .container .job-tile .job-card .job-description {
        margin-top: 0px;
        margin-left: -15px;
        overflow-y: auto;
        height: 100px;
        line-height: 22px;
        overflow-x: scroll

For apply and view button css:

    .job-container .container .job-tile .job-card .job-buttons {
        bottom: 2%;
        width: 96%;
        margin-left: 6%;
        position: absolute;

Please help me to fix the issue, thanks

htmlcss


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions