How to Use an <H2> Tag </H2> Inside a <P></P> in The Middle of a Text

How to use an h2 tag /h2 inside a p/p in the middle of a text?

It's not appropriate to use a tag that means "heading" within body text. The <h..> tags are logical tags; their use imparts meaning to the enclosed text -- namely, that the text is a section heading.

Although you could use the display: inline attribute, consider using a more appropriate tag, or even a <span> tag.

P tag and H2 tag in same div inline

This works...

body {    font-family: 'Oswald', sans-serif;    text-align: center;    background-color: #dcecf1;    margin: 0px;    padding: 0px;}
.header {
    overflow: hidden;    background-color: #292929;    padding: 20px;    margin-bottom: 40px;    margin-left: 0px;    -webkit-box-shadow: 3px 10px 23px -9px rgba(0,0,0,0.67);    -moz-box-shadow: 3px 10px 23px -9px rgba(0,0,0,0.67);    box-shadow: 3px 10px 23px -9px rgba(0,0,0,0.67);
}
.header h2 {    display:inline;    color: #d4d4d4;    text-align: center;    padding: 12px;    text-decoration: none;    font-size: 20px;    line-height: 25px;    border-radius: 4px;}
.header h2.logo {    font-size: 50px;    font-weight: bold;    margin:auto;    text-align: center;    position: absolute;    left: 0; right: 0;    padding: 0;}

.headerp{
    font-family: 'Poly' Serif;    color: #d3d3d3;    margin: 0 auto;    float:left;}

<body>    <div class="header">        <p class="headerp">Name</p>        <h2 class="logo">Title</h2>    </div>            <button>Button</button></body>

How can I get text from only p and h2 tags when finding element by class with selenium and python?

I solved it using css selectors, but didn't combine them into one. Another commenter's answer using xpath and class name combining the two is a possible solution.

libra_h2 = driver.find_element(By.CSS_SELECTOR, 'div.horoscope-content > h2')
libra_p = driver.find_element(By.CSS_SELECTOR, 'div.horoscope-content > p')

Putting an H2 with my text p while having it styled with text-align:center; don't work

Try below

<h2>
<p style="text-align:center;">HOME </p>
</h2>

Is it valid to have paragraph elements inside of a heading tag in HTML5 (P inside H1)?

Actually, no. This markup is not correct according to W3C. You should avoid using this.

It is stated that the correct content for header elements is a "phrasing content", which is phrasing elements intermixed with normal character data.

In other words you can use the following convenient elements inside of a header tag in HTML5: a, em, strong, code, cite, span, br, img. See the full list here.

The W3C validator will give you the following error if you will try to validate this markup: Element p not allowed as child of element h1 in this context.

The one major drawback of using this markup that you should consider is that search engines can incorrectly parse your heading tag and miss important data. So this practice can be bad for SEO.

If you would like a better SEO results it is a good practice to include only textual data inside of a heading elements. But, if you also need to apply some styles, you can use the following markup and CSS:

<h1>
    <span class="major">Major part</span>
    <span class="minor">Minor part</span>
</h1>

<style type="text/css">
    h1 span {
        display: block;
    }
    h1 span.major {
        font-size: 50px;
        font-weight: bold;
    }
    h1 span.minor {
        font-size: 30px;
        font-style: italic;
    }
</style>

See the jsfiddle for this.

As stated before, span tag is perfectly valid inside of a header elements (h1-h6). And you can apply "display: block;" style to it to make it render as a block level element (each on a different line). It will save you a br tag.

Of course you will need to change this CSS selectors according to your use case.

And yes, as stUrb said it's not semantically correct to use paragraphs inside of a headings. The most important idea behind HTML is that it must be a semantics first, presentation later.

Is nesting a h2 tag inside another header with h1 tag semantically wrong?

“Semantically wrong” is largely a matter of opinion (“semantics” means “relating to meaning”, but what would be the meaning here?), but the construct isn’t even syntactically (formally) correct. According to all HTML specifications and drafts, an h1 element must not contain an h2 element.

As regards to markup for a “subheading”, or a secondary part of a heading, there have been heavy debates on it, especially as regards to the proposed hgroup element (which would let you use h1 followed by h2 as if it were a single heading). The practical approach has been, and still is, to use markup like

<h1 class="fixed">
Primary heading text<br>
<small class="absolute">
Secondary heading text
</small>
</h1>

I have preserved your class names here, but they suggest that perhaps you should not be using heading elements at all. The h1 element is supposed to be the overall heading for the page, and an h2 element is supposed to be a heading at the next lower level, for a top-level section of the page.

Can we use any other TAG inside ul along with li?

For your code to be valid you can't put any tag inside a <ul> other than an <li>.

You can however, put any block level element inside the <li>, like so:

<ul>
        <li>
            <h2>...</h2>
            <p>...</p>
            <p>...</p>
        </li>
</ul>

How to write both h1 and h2 in the same line?

Keyword float:

<h1 style="text-align:left;float:left;">Title</h1> 
<h2 style="text-align:right;float:right;">Context</h2> 
<hr style="clear:both;"/>

How to Use an <H2> Tag </H2> Inside a <P></P> in The Middle of a Text