Aligning the objects in SVG center

Question

How can i align objects within svg tag center. I can make it aligned by adjusting the x,y cordiantes in viewbox. But every time i need to change the value according to the size

Answer 1

svg {
  border: 1px solid red;
}
.svg--center{  
  background: pink;
  display: inline-block;
  width: 100px;
  line-height: 100px;
  text-align: center;
  vertical-align: middle;
}