Different Between 'P' tag and 'DIV'

[najmul]

Sometimes tag 'P' and div works like same after using id/class .But when I use them interchangeably line brokes.

 

HTML : Confusing P tag ( Why used p tag here, why not div is used here?<section id="top"> <div class="con"> <p class="list fl"> <a href="">Home</a> <a href="">About Us</a> <a href="">Services</a> <a href="">Portfolio</a> <a href="">Blog</a> <a href="">Contact</a> </p> <p class="fr"> <a href=""class="fl">Grab Our feeds</a> <a href="#" class="icon-feed fl"></a> <input type="text" class="search fr" value="Search ..." <button class="go left rounded"><span></span></button> </p> <p class="clf"></p> </div> </section>

[Ingolme]

That's the wrong way to use a <p> tag. The difference between <p> and <div> is that <p> is meant to contain paragraphs of text and <div> can contain anything.

 

Whoever is using the <p> tag there probably wanted the default styling from it. You can apply margins to the <div> element for that.

[kelly2marie]

First, it's great that you noticed this!

 

Here's what I would do, or one could do.............

 

 

<section id="top"> <div class="con"> <p class="list fl"> <a href="">Home</a> <a href="">About Us</a> <a href="">Services</a> <a href="">Portfolio</a> <a href="">Blog</a> <a href="">Contact</a> </p> <p class="fr"> <a href=""class="fl">Grab Our feeds</a> <a href="#" class="icon-feed fl"></a> <input type="text" class="search fr" value="Search ..." <button class="go left rounded"><span></span></button> </p> <p class="clf"></p> </div> </section>

 

<section id="top">

-- omit div --

<ul class="list fl">

<li><a href="#">Home</a></li>

<li><a href="#">About</a></li>

<li><a href="#">Services</a></li>

<li><a href="#">Blog</a></li>

</ul>

<ul class="fr">

<li><a href="#">Grab our Feeds</a>

etc...................

</ul>

</section>