why the full stop in my html code is printing in the next line?-CodePudding

  <body>
    <h1>VARUN TEJA KOMIRISHETTI</h1>
    <p><em><strong><h2>student</h2></strong></em>.</p>

  </body>

why the full stop is printing in the next line?

CodePudding user response：

Its because, all headings incliding h2is a block element, you can make it appear in same line by adding a class and, adding property display: inline-block

.header-title{
  display: inline-block;
}

<body>
    <h1>VARUN TEJA KOMIRISHETTI</h1>
    <p><em><strong><h2 >student</h2></strong></em>.</p>
</body>

CodePudding user response：

Because h2 and every heading elements are block elements. All of block elements has 100% width, so there is no space for this dot in one line. If you change h2 to display: inline; or display: inline-block;, then the dot will be in one line with student.