Jump to content
jocar6562

html4 /5 validation

Recommended Posts

Hi I cannot find a way to validate this code. marked in red error The report I get back is "expected Element p not allowed as child of element h2 in this context"

 

<div class="content-grid">

<a href="single.html" class="b-link-stripe b-animate-go">

<img src="images/pi2.jpg" alt="rose">

<div class="b-wrapper">

<h2 class="b-animate b-from-left b-delay03 ">

<span>Cool App Design</span>

<p>development, mobile</p>

<i> </i>

</h2>

</div>

 

When I rewrite to;

 

<div class="content-grid">

<a href="single.html" class="b-link-stripe b-animate-go">

<img src="images/pi2.jpg" alt="rose">

<div class="b-wrapper">

<h2 class="b-animate b-from-left b-delay03 ">

<span>Cool App Design</span>

development, mobile

<i> </i>

</h2>

</div>

The above goes through validation when published but just below the 2 lines of text is a short Line you loose this effect on the 2nd script

Tried all the tags tried lo li h1 h2 3h and others to try and get it validated with to include the short line below the text.

But I am stuck

Thank you for your time

 

JohnC

Edited by jocar6562

Share this post


Link to post
Share on other sites

Like the error message says you cannot have block element paragraph within block element h2, but you can use inline element such as span.

 

You can use <br> or a span and style it as a block element.

Edited by dsonesuk

Share this post


Link to post
Share on other sites

Like the error message says you cannot have block element paragraph within block element h2, but you can use inline element such as span.

 

You can use <br> or a span and style it as a block element.

Hi

Thank you The <i> and <span> worked but put the text out of place the <br> worked well. I did think about styling it in a block but <br> works fine.AS I understand the <br> is useful for writing addresses and poems and did not consider using it for other purposes.

 

Thank you again for your time

 

JohnC

 

JohnC

Share this post


Link to post
Share on other sites

All you had to do really is make first-child span a block element

.b-animate.b-from-left.b-delay03 span:first-child {display: block;}

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...