We're calling on all EU-based Mozillians with iOS or iPadOS devices to help us monitor Apple’s new browser choice screens. Join the effort to hold Big Tech to account!

Pesquisar no apoio

Evite burlas no apoio. Nunca iremos solicitar que telefone ou envie uma mensagem de texto para um número de telefone ou que partilhe informações pessoais. Por favor, reporte atividades suspeitas utilizando a opção "Reportar abuso".

Saber mais

Firefox renders html in a wrong way some time

  • 4 respostas
  • 6 têm este problema
  • 1 visualização
  • Última resposta por falkon303

more options

I have a list of items to display in a page.

The following html displays an item.

<a href="#" class="offerModule">

 <div class="offerDetailsWrap">
   <img src="mymb.jpg" alt="" />
   <div class="offerDetails">
     <img src="logobox.jpg" alt="" />
     <div class="offerText">
       <p>text content</p>
     </div>
   </div>
 </div>

</a>


But some time, Firefox renders this like this: (I checked this in Firebug)


 <a href="#" class="offerModule">
 </a>
 <div class="offerDetailsWrap">
   <a href="#" class="offerModule">
     <img src="mymb.jpg" alt="" />
     <div class="offerDetails">
       <img src="logobox.jpg" alt="" />
       <div class="offerText">
         <p>text content</p>
       </div>
     </div>
   </a>
 </div>


<a><div>...</div></a> ====> <a></a><div><a>...</a></div>


So only one item out of 8 items is broken in the page. If I refresh the page when I have this problem, it displays very well.

I tested this in IE and Chrome, there's no problem in the browsers.

Thanks,

Jun

I have a list of items to display in a page. The following html displays an item. &lt;a href="#" class="offerModule"&gt; &lt;div class="offerDetailsWrap"&gt; &lt;img src="mymb.jpg" alt="" /&gt; &lt;div class="offerDetails"&gt; &lt;img src="logobox.jpg" alt="" /&gt; &lt;div class="offerText"&gt; &lt;p&gt;text content&lt;/p&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/a&gt; But some time, Firefox renders this like this: (I checked this in Firebug) &lt;a href="#" class="offerModule"&gt; &lt;/a&gt; &lt;div class="offerDetailsWrap"&gt; &lt;a href="#" class="offerModule"&gt; &lt;img src="mymb.jpg" alt="" /&gt; &lt;div class="offerDetails"&gt; &lt;img src="logobox.jpg" alt="" /&gt; &lt;div class="offerText"&gt; &lt;p&gt;text content&lt;/p&gt; &lt;/div&gt; &lt;/div&gt; &lt;/a&gt; &lt;/div&gt; &lt;a&gt;&lt;div&gt;...&lt;/div&gt;&lt;/a&gt; ====> &lt;a&gt;&lt;/a&gt;&lt;div&gt;&lt;a&gt;...&lt;/a&gt;&lt;/div&gt; So only one item out of 8 items is broken in the page. If I refresh the page when I have this problem, it displays very well. I tested this in IE and Chrome, there's no problem in the browsers. Thanks, Jun

Modificado por junjeong a

Todas as respostas (4)

more options

I attached the screen shot.

more options

I am having the exact same problem with my soup website (http://www.oopsoup.com) on firefox 3.6. Chrome displays it fine, as does Safari, but firefox messes it up very badly.

I don't see any scripting errors on my side, and there's some times it randomly wraps elements in hyperlinks.

more options

It seems we are both styling a tags using the block attribute. This could be part of the problem/solution.

more options

I have replace my "a" element with a "div" containing a onclick="document.location.href = 'http://www.whatever.com';", and inside of the element I also have the image hyperlinked to help SEO/crawling aspects. Everything seems to be fine/not garbled so far, so you may want to try this solution yourself.

Modificado por falkon303 a