Remove spacing between <hr> and <div> [duplicate] - html

Question

This question already has answers here:
What is the default padding and/or margin for a p element (reset css)?
(5 answers)
Closed 1 year ago.
I'm trying to put the div right below hr tag but it doesn't seem to work. I tried adding padding: 0; margin: 0; Instead nothing changes. Right now I have this:
But instead I want something like the image below:
HTML:
<hr class="hr">
<div class="alttxt">
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis knostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
mollit anim id est laborum. </p>
</div>
CSS:
.hr {
border: 3px solid #ffffff;
margin: 0 5% 0 5%;
padding-bottom: 0 !important;
}
.alttxt {
background-color: rgba(1,1,1,0.5);
margin-top: 0 !important;
margin: 0 5% 0 5%;
}
.alttxt p {
text-align: justify;
padding: 3% 3% 3% 3%;
color: white;
font-size: 140%;
}

Answer 1

Remove the default margin from the paragraph
.hr {
border: 3px solid red;
margin: 0 5% 0 5%;
}
.alttxt {
background-color: rgba(1, 1, 1, 0.5);
margin: 0 5% 0 5%;
}
.alttxt p {
text-align: justify;
padding: 3% 3% 3% 3%;
color: white;
font-size: 140%;
margin: 0;
}
<hr class="hr">
<div class="alttxt">
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis knostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
mollit anim id est laborum. </p>
</div>

Answer 2

Play with the .alttxt margins
I chose 7%
That's the only change I made to your css
.hr
{
border: 3px solid #0000ff;
margin: 0 5% 0 5%;
padding-bottom: 0 !important;
}
.alttxt
{
background-color: rgba(1,1,1,0.5);
margin-top: 0 !important;
margin: 0 7% 0 7%;
p
{
text-align: justify;
padding: 3% 3% 3% 3%;
color: white;
font-size: 140%;
}
}