html - Why does a div with display:none break formatting? -


the html code below consistently results in text , textb not being horizontally aligned removing <div style="display:none;">&nbsp;</div> fixes alignment. discovered using div elements instead of p elements fixing issue, wondering going on. saw behavior in in opera, firefox, ie (ie puts textb on separate line), , chrome.

my expectation div display:none not have impact on formatting.

<html>     <body>         <div style="border-top-style: solid;">             <p style="float:left; width:280px;">                 text a<div style="display:none;">&nbsp;</div>             </p>             <p style="float:left;">                 textb             </p>         </div>     </body> </html> 

div not valid child of p, browser applies error correction html end this:

<div style="border-top-style: solid;">     <p style="float:left; width:280px;">         text a</p><div style="display:none;">&nbsp;</div>     <p></p>     <p style="float:left;">         textb     </p> </div> 

(html taken chrome's inspector)

note p element.


Comments

Popular posts from this blog

linux - Using a Cron Job to check if my mod_wsgi / apache server is running and restart -

actionscript 3 - TweenLite does not work with object -

jQuery Ajax Render Fragments OR Whole Page -