Databases
StackOverflow2013
Postsdbo
POHow to move a +1 google plug-in up when in a div box in IE9
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to move a +1 google plug-in up when in a div box in IE9
    text
    copied!<p><strong>Hi</strong>, I have my web page here at <a href="http://thetotempole.ca" rel="nofollow">thetotempole.ca</a>. My social media div bar at the very top of the site has a plug in for Google's plus one and in IE9 it shows only half of the plus one. I am wondering how I could move this up into the div so that the whole plug in is showing. Here is my HTML: </p> <pre><code>&lt;!doctype html&gt; &lt;head&gt; &lt;title&gt;The Totem Pole News&lt;/title&gt; &lt;meta name="description" content=" A totem pole themed news website posting articles on music, movies, video games, mobile applications, and news."&gt; &lt;link href="thecss.css" rel="stylesheet" type="text/css"&gt; &lt;script type="text/javascript" src="https://apis.google.com/js/plusone.js"&gt;&lt;/script&gt; &lt;script&gt; ! function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0], p = /^http:/.test(d.location) ? 'http' : 'https'; if (!d.getElementById(id)) { js = d.createElement(s); js.id = id; js.src = p + '://platform.twitter.com/widgets.js'; fjs.parentNode.insertBefore(js, fjs); } }(document, 'script', 'twitter-wjs'); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="fb-root"&gt;&lt;/div&gt; &lt;script&gt; (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); &lt;/script&gt; &lt;div id="socialmediaplugins"&gt; &lt;div id="facebook"&gt; &lt;div class="fb-like" data-href="http://www.thetotempole.ca" data-width="The pixel width of the plugin" data-height="The pixel height of the plugin" data-colorscheme="light" data-layout="standard" data-action="like" data-show-faces="true" data-send="false"&gt;&lt;/div&gt; &lt;/div&gt; &lt;div id="twitter"&gt;&lt;a href="https://twitter.com/share" class="twitter-share-button"&gt;Tweet&lt;/a&gt; &lt;/div&gt; &lt;g:plusone&gt;&lt;/g:plusone&gt; &lt;/div&gt; &lt;div id="container"&gt; &lt;div id="contentbox" align="Center"&gt; &lt;div id="banner" align="Center"&gt;&lt;/div&gt; &lt;div id="navbar"&gt; &lt;a href="#"&gt;Home&lt;/a&gt; &lt;a href="#"&gt;Link 1&lt;/a&gt; &lt;a href="#"&gt;Link 2&lt;/a&gt; &lt;a href="#"&gt;Link 3&lt;/a&gt; &lt;a href="#"&gt;Link 3&lt;/a&gt; &lt;/div&gt; &lt;div id="navbar2"&gt; &lt;a href="#"&gt;Home&lt;/a&gt; &lt;a href="#"&gt;Link 1&lt;/a&gt; &lt;a href="#"&gt;Link 2&lt;/a&gt; &lt;a href="#"&gt;Link 3&lt;/a&gt; &lt;a href="#"&gt;Link 3&lt;/a&gt; &lt;/div&gt; &lt;!-- This is the end of the contentbox --&gt; &lt;/div&gt; &lt;!-- This is the end of the container div --&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>And here is my CSS:</p> <pre><code>body { margin-bottom: 0px; background-color: #333; } #container { width: 1100px; height: 1000px; position: relative; margin-right: auto; margin-left: auto; z-index: 1; } #facebook { position: fixed; right: 100px; z-index: 15; } #twitter { position: fixed; z-index: 16; right: 120px; } #google { position: fixed; top: 7px; right: 140px; } #socialmediaplugins { text-align: right; position: fixed; background: rgb(125,126,125); /* Old browsers */ background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(247,247,247,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(247,247,247,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#f7f7f7',GradientType=0 ); /* IE6-9 */ margin: 0px; top: 0px; left: 0px; right: 0px; z-index: 14; } #contentbox { background-color: #999; width: 1100px; height: 1000px; } #banner { background-image: url(images/totempolebanner.gif); position: absolute; top: 25px; width: 960px; height: 150px; left: 70px; } #navbar { float: left; position: absolute; top: 175px; left: 70px; } #navbar2 { position: absolute; top: 175px; left: 815px; } </code></pre> <p>Thanks!!</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload