Someone to assist please, how can I spread the texts to occupy the full height of my div[.newspaper] container,
<!--file: index.html-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Newspaper Article</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<div class="newspaper">
<div class="name">The Daily Chronicle</div>
<div class="date">April 25, 2025</div>
<div class="headline">
Local Community Launches Green Initiative to Combat Climate Change
</div>
<div class="sub-headline">
Residents and Businesses Unite for Sustainable Future
</div>
<div class="author">By Alex Johnson</div>
<p class="text">
In an inspiring display of community spirit, the town of Willowbrook has
launched "Green Horizons," a bold new initiative aimed at reducing
carbon emissions and promoting sustainable living. The project, funded
by local businesses and volunteers, includes tree-planting drives, solar
panel installations, and educational workshops on waste reduction. Mayor
Elena Rodriguez praised the effort, stating, "This is more than an
environmental campaign—it’s a commitment to our children’s future." Over
200 residents attended the kickoff event, pledging to cut household
waste by 30% this year.
</p>
<p class="text">
Experts warn that small-scale efforts like Willowbrook’s are crucial in
the fight against climate change. "Local action creates a ripple
effect," said Dr. Samuel Greene, an environmental scientist. The
initiative has already attracted attention from neighboring towns, with
three communities planning similar programs. Challenges remain,
including funding for long-term projects, but organizers remain
optimistic. "Change starts at home," said high school student and
volunteer Liam Carter, "and we’re just getting started."
</p>
</div>
</body>
</html>
<!--file: styles.css-->
body {
background-color: rgb(210, 198, 198);
}
html {
font-size: 24px;
}
.newspaper {
font-size: 16px;
font-family: Open Sans, sans-serif;
background-color: white;
width: 700px;
height: 900px;
border-radius: 10px;
margin: 20px auto;
box-shadow: 0 3px 5px 0 black;
}
.name {
font-size: 2rem;
font-family: "Times New Roman", serif;
}
.name,
.author {
text-transform: uppercase;
}
.headline {
font-size: 2em;
font-weight: bold;
}
.sub-headline {
font-weight: 100;
font-size: 1.5em;
font-style: italic;
}
.author {
font-weight: bold;
}
.text {
text-indent: 20px;
line-height: 2em;
}
.text::first-letter {
font-size: 2em;
font-weight: bold;
}
.name,
.date,
.author,
.headline,
.sub-headline,
.text {
margin: 10px;
}