<div class="eq-c">
	<var>y</var> = 
	<span class="radical">√</span>
  <span class="radicand"><var>x</var><sup>2</sup> + 6</span>
</div>
// Body
body{
  position: absolute !important;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  font-size: 2rem;
  text-align: center;
}

html *{
  position: relative;
} 

.eq-c {
  text-align: center;
  padding: 0em 0em;
  font-size: 2rem;
  & .radical {
    font-size: 3.6rem;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    right: -0.8rem;
  }
  & .radicand {
    top: 0.4rem;
    padding: 0 0.5rem;
    border-top: 0.2rem black solid;
  }
  & sup {
    font-size: 75%;
  }
}  
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.