Display work fine with iPhone Chrome and Safari browser, but not on Windows 7

I have the display problem on different browsers.  In iPhone, the Google Chrome browser and the Safari browser they display the content fine.  In Windows 7, both these browsers will not display the content properly.  float:right does not make the unorder list float to right and always stay on the left.  display:inline does not make the unorder list lineup horizontally instead of vertically.  I would like to find out why and how to resolve this problem.  I am very much new in the Dreamweaver, HTML and CCS.  Thank you for any help.

HTML:

<div id="social-media-icons">

     <ul>

         <li><a href="http://www.facebook.com"><img src="images/icons/facebook-icon.png" /></a></li>

         <li><a href="http://www.twitter.com"><img src="images/icons/twitter-icon.png" /></a></li>

         <li><a href="http://www.linkedin.com"><img src="images/icons/linkedin-icon.png" /></a></li>

         <li><a href="http://www.youtube.com"><img src="images/icons/youtube-icon.png" /></a></li>

      </ul>

</div>

CSS:

#social-media-icons   {float:right; }

#social-media-icons ul  {margin-top:40px; } 

#social-media-icons ul li  {display:inline; }