Breaking News: Grepper is joining You.com. Read the official announcement!

html align svg to text

Light Lemur answered on December 7, 2020 Popularity 8/10 Helpfulness 7/10

answer html align svg to text

html align svg to text

Comment

/* html-part: Pay attention to the correct name */
<div class="icon baseline">
    <svg width="48" height="48" viewBox="0 0 48 48">
       <path .../>
  	</svg>
</div>

/* css-part */
.svg-icon {
  display: inline-flex;
  align-self: center;
}

.svg-icon svg {
  height:1em;
  width:1em;
}

.svg-icon.svg-baseline svg {
  top: .125em;
  position: relative;
}

Popularity 8/10 Helpfulness 7/10 Language css

Source: blog.prototypr.io

Tags: css html svg text

Link to this answer
Share Copy Link