Padding of text in footer sticks to top

I am not sure what’s the issue here as it seems a pretty simple situation, but I can’t make it work. So I simply want to manipulate the position of content in my footer vertically but it keeps sticking to the top of it. Padding, Margin, nothing helps…why not?

.footer{
	background-color: #333;
	height: 50px;
	text-align: center;
}

.imprint p{
	color: #fff;
	padding: 50 px;
}
    <footer class="footer">
      <div class="imprint">
       <p>&copy; 2017 Bike Berlin</p>
       </div>
    </footer>


You dont need to add height and remove space between 50 and px

.footer{
	background-color: #333;
	text-align: center;
}

.imprint p{
	color: #fff;
	padding: 15px;
}
    <footer class="footer">
      <div class="imprint">
       <p>&copy; 2017 Bike Berlin</p>
       </div>
    </footer>

If you have only one line at the footer, you can use line-height: 50px.
It will make the line height to the height of the footer, therefore the text will be at the middle.

do not use footer tag while referring the footer. You have the class to adjust it. This is normal behavior (among browser implementations at least). Margin does not affect the child’s position in relation to its parent unless the parent has padding, in which case most browsers will then add the child’s margin to the parent’s padding.
Try using this, It may works:

.footer{
background-color: #333;
height: 50px;
text-align: center;

}

.imprint p{
 color: #fff;
 padding-top:15px;
}

And change footer to div:

<div class="footer">
  <div class="imprint">
   <p class="para">&copy; 2017 Bike Berlin</p>
   </div>
</div>

Remove the height property and use padding for .imprint p instead. You just have to add equal amount of space on the top and bottom edges of your container

Just change padding value to 15px, it will solve your problem.

.footer{
    background-color: #333;
    height: 50px;
    text-align: center;
      }
.imprint p{
    color: #fff;
    padding: 15px;
  }