CODEWITHSUNDEEP
htmlcss
Catalin
Catalin

Reputation: 81

Viewing list wrong on firefox

So i have this problem:

-On Chrome its showing this:

''' '''

-On Mozzila Firefox its showing this:

''' '''

I want to look like on chrome does on every platform.

<h3>Servicii</h3>
</br>
<ul>
<li><a href="#><h4 style="color:#2e3760;">Beneficiari publici</h4></a></li>
<li><a href="#"><h4 style="color:#2e3760;">Beneficiari privati</h4></a></li>
<li><a href="#"><h4 style="color:#2e3760;">HelpDesk</h4></a></li>
</ul>

Firefox doesnt like the heading tag inside <a> tag, it seems.

Upvotes: 0

Views: 40

Answers (2)

Fabrizio Calderan
Fabrizio Calderan

Reputation: 123397

Headings can't shouldn't be nested inside a phrasing content like a link or weird layout issues could happen, so try this structure instead

<h3>Servicii</h3>
<br>
<ul>
<li><h4 style="color:#2e3760;"><a href="#>Beneficiari publici</a></h4></li>
<li><h4 style="color:#2e3760;"><a href="#>Beneficiari privati</a></h4></li>
<li><h4 style="color:#2e3760;"><a href="#">HelpDesk</a></h4></li>
</ul>

As a side note, there's no a </br> tag

Upvotes: 2

Habib
Habib

Reputation: 29

<h3>Servicii</h3>
<br>
<ul>
  <li><h4><a href="#" style= "color:#2e3760;" >Beneficiari publici</a></h4></li>
  <li><h4><a href="#" style= "color:#2e3760;" >Beneficiari privati</a></h4></li>
  <li><h4><a href="#" style= "color:#2e3760;" >Help Desk</a></h4></li>
</ul>

You can not use "Headings inside of an "Anchor" tag but you can use Anchor tag inside of a heading like my code. and sometimes you could face a problem with colors. It's better to define style on an inside element like I declared color inside a tag.

Upvotes: 1

Related Questions