Creating a Responsive Div with Padding and Text

Here is some code to create a responsive div with purple background, white text, and centered formatting:



Style:

.testimonial {
background-color: #693591; /* Purple background color */
color: #fff; /* White text color */
padding: 20px;
margin: 20px;
font-family: 'Georgia', serif; /* Font style */
font-size: 1.2rem; /* Adjust font size as needed */
line-height: 1.5; /* Line spacing */
border-radius: 8px; /* Rounded corners */
max-width: 600px; /* Optional max width for responsiveness */
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow */
}
.testimonial p { margin: 0;}
.testimonial .author {
margin-top: 10px;
font-weight: bold;
text-align: right;
}

Body Div:

<div class="testimonial">
Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit. Nam facilisis, diam id gravida aliquam, ut fringilla felis lectus ut libero.
<p> class="author">- Name.</p>
</div>

• The .testimonial class styles the main container with a purple background, white text, padding, and rounded corners.
• The p element contains the main text, while the .author class is used to style and align the author’s name to the right.
• The box-shadow adds a subtle shadow for a slightly raised look.

Feel free to adjust the styles to fit your specific needs, such as changing font sizes, padding, or color shades.