1

I am using p tag as parent and adding few elements in it. But the problem is, when you look at inspect code p tag is displaying individually and it is not holding the childs inside.

Her is the html

<div class="createapp_div">
                 <p><h1>Select</h1> <button class=""></button> <button class=""></button></p>
                 <p><span>Name</span> <input type="text" /></p>
                <button>Create</button>
            </div>

FIDDLE

Sowmya
  • 26,684
  • 21
  • 96
  • 136
  • see this [link](http://stackoverflow.com/questions/4675985/how-to-use-an-h2-tag-h2-inside-a-p-p-in-the-middle-of-a-text) for reference – Aravind30790 Jun 26 '13 at 12:15

2 Answers2

9

Explanation

The p DOM Element can only contain inline elements. (MDN) (W3C HTML5)

The start tag is mandatory. The end tag may be omitted if the <p> element is immediately followed by an <address>, <article>, <aside>, <blockquote>, <div>, <dl>, <fieldset>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hr>, <menu>, <nav>, <ol>, <pre>, <section>, <table>, <ul> or another <p> element, or if there is no more content in the parent element and the parent element is not an <a> element.

Permitted tags

Here is an exhaustive list of the permitted tags inside a p element.

Content:

<abbr>, <audio>, <b>, <bdo>, <br>, <button>, <canvas>, <cite>, <code>, <command>, <datalist>, <dfn>, <em>, <embed>, <i>, <iframe>, <img>, <input>, <kbd>, <keygen>, <label>, <mark>, <math>, <meter>, <noscript>, <object>, <output>, <progress>, <q>, <ruby>, <samp>, <script>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <textarea>, <time>, <var>, <video>, <wbr> and plain text (not only consisting of white spaces characters).

Community
  • 1
  • 1
Jeff Noel
  • 7,500
  • 4
  • 40
  • 66
0

You shouldn't place headers inside a <p> element.

Mr. Alien
  • 153,751
  • 34
  • 298
  • 278
Alex Marinov
  • 191
  • 1
  • 5