Home > Back-end >  Spacing lines of a single paragraph vertically
Spacing lines of a single paragraph vertically

Time:06-23

I have a <p> element that I put inside of a box. As a result the single line of text has collapsed into multiple lines of text. How to I space the multiple lins of text out vertically?

        
        <div >
            <span ></span>
            <span ></span>
            <span ></span>
            <span ></span>
            <span ></span>
            <span >8 months ago</span>
            <p >Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam quas magni tenetur ipsum repellendus debitis eveniet excepturi quo veritatis tempora! Fugiat excepturi aperiam ducimus vel asperiores eaque soluta et necessitatibus!</p>
            <p>-Andrew M.</p>
        </div>
        <div ><span ></span>
            <span ></span>
            <span ></span>
            <span ></span>
            <span ></span>
            <span >2 months ago</span>
            <p >Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam quas magni tenetur ipsum repellendus debitis eveniet excepturi quo veritatis tempora! Fugiat excepturi aperiam ducimus vel asperiores eaque soluta et necessitatibus!</p>
            <p>-Kenneth W.</p></div>
        <div ><span ></span>
            <span ></span>
            <span ></span>
            <span ></span>
            <span ></span>
            <span >2 days ago</span>
            <p >Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam quas magni tenetur ipsum repellendus debitis eveniet excepturi quo veritatis tempora! Fugiat excepturi aperiam ducimus vel asperiores eaque soluta et necessitatibus!</p>
            <p>-Regina T.</p></div>



</div>

<style>
.testimonials-container {
    margin-top: 3em;
    width: 100%;
    text-align: center;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.testHeading {
    text-align: center ;
    margin-top: 2em;
}

.test {
text-align: left;
text-indent: 2em;
}
.checked {
    color: orange;
}

.date {
    margin-left: 1em;
}

p {
    margin: 10px 0;
}
</style>

CodePudding user response:

Use line-height property in css for your <p> tag.

.test {
    line-height: 10px; //Or some other value to adjust
}
  • Related