browserDetectingWindow

by Joe Saad

HTML

<div class="popupBox modal30 modal">
    <img alt="Close Window" src="/resources/assets/images/public/btn_close_modal.png" class="close-it M-closeit" />
    	<div class="M-heading">
            <img src="/resources/assets/images/emails/tou_hdr_logo.png"  class="centerText"/>
            <h1>Please update your browser</h1>
        </div>
       	<div class="M-content">
       	    <p>
       	        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nam at expedita quos dolores distinctio odit ipsa maxime molestiae explicabo tempora obcaecati nostrum earum placeat aliquam aliquid natus laudantium nihil eaque.
       	    </p>
            <ul>
                <li>Firefox</li>
                <li>Chrome</li>
                <li>Internet Explorer 9 and beyond</li>
                <li>Safari</li>
            </ul>
            <p>
                Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facilis temporibus quod dolore esse ipsa libero odit veniam velit quia quo beatae amet.
            </p>
            <ul class="horzSects">
                <li>
                    <a href="">
                    <img src="http://placehold.it/80x80" alt="Firefox" />
                    </a>
                    <div><a href="https://www.mozilla.org/en-US/firefox/new/?cmpid=INTL0017">Firefox</a><br>By Mozilla</div>
                </li>
                <li>
                    <a href="">
                    <img src="http://placehold.it/80x80" alt="Chrome" />
                    </a>
                    <div><a href="https://www.google.com/intl/en/chrome/browser/">Chrome</a><br>By Google</div>
                </li>
                <li>
                    <a href="">
                    <img src="http://placehold.it/80x80" alt="Internet Explorer" />
                    </a>
                    <div><a href="http://windows.microsoft.com/en-us/internet-explorer/download-ie">Internet Explorer</a><br>Microsoft</div>
                </li>
                <li>
        ...

CSS

/*
.horzSects {list-style-type: none;}
.horzSects li {float: left; margin: 10px; width: 80px; height: 100px; background:url('http://placehold.it/80x80') top left no-repeat; padding-top: 85px; text-align:center; }
.horzSects li a {clear:both}
.clear {clear:both}

*/

.horzSects {list-style-type: none;}
.horzSects li {float: left; margin: 10px; text-align:center }
.horzSects li a {clear:both}
.clear {clear:both}